carbon-react 111.12.3 → 111.12.5

package/esm/__internal__/DeprecationWarning.js

@@ -1,5 +1,6 @@
 import React from "react";
 import PropTypes from "prop-types";
+
 const DeprecationWarning = ({
   children
 }) => /*#__PURE__*/React.createElement("div", {
@@ -12,6 +13,7 @@ const DeprecationWarning = ({
     marginBottom: 10
   }
 }, children);
+
 DeprecationWarning.propTypes = {
   children: PropTypes.node.isRequired
 };

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

@@ -1,6 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 import StyledCharacterCount from "./character-count.style";
+
 const CharacterCount = ({
   value,
   limit,
@@ -11,6 +12,7 @@ const CharacterCount = ({
   isOverLimit: isOverLimit,
   "data-element": dataElement
 }, `${value}/${limit}`);
+
 CharacterCount.propTypes = {
   "data-element": PropTypes.string,
   "isOverLimit": PropTypes.bool.isRequired,

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

@@ -6,6 +6,7 @@ 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 = ({
   ariaLabelledBy: externalAriaLabelledBy,
   autoFocus,
@@ -106,6 +107,7 @@ const CheckableInput = ({
     reverse: reverse
   }, /*#__PURE__*/React.createElement(InputBehaviour, null, /*#__PURE__*/React.createElement(FormField, formFieldProps, /*#__PURE__*/React.createElement(StyledCheckableInput, null, /*#__PURE__*/React.createElement(HiddenCheckableInput, inputProps), children))));
 };
+
 CheckableInput.propTypes = {
   "about": PropTypes.string,
   "accept": PropTypes.string,
@@ -173,6 +175,9 @@ CheckableInput.propTypes = {
   "contentEditable": PropTypes.oneOfType([PropTypes.oneOf(["false", "inherit", "true"]), PropTypes.bool]),
   "contextMenu": PropTypes.string,
   "crossOrigin": PropTypes.string,
+  "css": PropTypes.oneOfType([PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__emotion_styles": PropTypes.any.isRequired
+  }), PropTypes.string, PropTypes.bool]),
   "dangerouslySetInnerHTML": PropTypes.shape({
     "__html": PropTypes.string.isRequired
   }),

package/esm/__internal__/checkable-input/hidden-checkable-input.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, { useContext } from "react";
 import PropTypes from "prop-types";
 import HiddenCheckableInputStyle from "./hidden-checkable-input.style";
 import { InputContext, InputGroupContext } from "../input-behaviour";
+
 const HiddenCheckableInput = ({
   name,
   checked,
@@ -27,26 +29,31 @@ const HiddenCheckableInput = ({
     onMouseEnter: onMouseEnterGroup,
     onMouseLeave: onMouseLeaveGroup
   } = useContext(InputGroupContext);
+
   const handleFocus = ev => {
     if (props.onFocus) props.onFocus(ev);
     if (onFocus) onFocus();
     if (onFocusGroup) onFocusGroup();
   };
+
   const handleBlur = ev => {
     if (props.onBlur) props.onBlur(ev);
     if (onBlur) onBlur();
     if (onBlurGroup) onBlurGroup();
   };
+
   const handleMouseEnter = ev => {
     if (props.onMouseEnter) props.onMouseEnter(ev);
     if (onMouseEnter) onMouseEnter();
     if (onMouseEnterGroup) onMouseEnterGroup();
   };
+
   const handleMouseLeave = ev => {
     if (props.onMouseLeave) props.onMouseLeave(ev);
     if (onMouseLeave) onMouseLeave();
     if (onMouseLeaveGroup) onMouseLeaveGroup();
   };
+
   return /*#__PURE__*/React.createElement(HiddenCheckableInputStyle, _extends({
     autoFocus: autoFocus,
     "aria-checked": checked,
@@ -66,6 +73,7 @@ const HiddenCheckableInput = ({
     ref: inputRef
   }));
 };
+
 HiddenCheckableInput.propTypes = {
   "about": PropTypes.string,
   "accept": PropTypes.string,
@@ -132,6 +140,9 @@ HiddenCheckableInput.propTypes = {
   "contentEditable": PropTypes.oneOfType([PropTypes.oneOf(["false", "inherit", "true"]), PropTypes.bool]),
   "contextMenu": PropTypes.string,
   "crossOrigin": PropTypes.string,
+  "css": PropTypes.oneOfType([PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__emotion_styles": PropTypes.any.isRequired
+  }), PropTypes.string, PropTypes.bool]),
   "dangerouslySetInnerHTML": PropTypes.shape({
     "__html": PropTypes.string.isRequired
   }),

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

@@ -1,6 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 import StyledFieldHelp from "./field-help.style";
+
 const FieldHelp = ({
   children,
   labelInline,
@@ -12,6 +13,7 @@ const FieldHelp = ({
   labelWidth: labelWidth,
   id: id
 }, children);
+
 FieldHelp.propTypes = {
   "children": PropTypes.node,
   "id": PropTypes.string,

package/esm/__internal__/fieldset/fieldset.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 { StyledFieldset, StyledLegend, StyledLegendContent } from "./fieldset.style";
 import ValidationIcon from "../validations/validation-icon.component";
 import { InputGroupBehaviour, InputGroupContext } from "../input-behaviour";
+
 const Fieldset = ({
   legend,
   children,
@@ -40,6 +42,7 @@ const Fieldset = ({
   info: info,
   tooltipFlipOverrides: ["top", "bottom"]
 })))), children));
+
 Fieldset.propTypes = {
   "blockGroupBehaviour": PropTypes.bool,
   "children": PropTypes.node,

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

@@ -1,12 +1,15 @@
 const defaultFocusableSelectors = 'button:not([disabled]), [href], input:not([type="hidden"]):not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]';
 const INTERVAL = 10;
 const MAX_TIME = 100;
+
 const setElementFocus = element => {
   let timeSoFar = 0;
+
   const stylesMatch = () => {
     const actualStyles = window.getComputedStyle(element);
     return actualStyles.visibility === "visible";
   };
+
   const check = () => {
     /* istanbul ignore else */
     if (stylesMatch()) {
@@ -14,25 +17,31 @@ const setElementFocus = element => {
     } else if (timeSoFar < MAX_TIME) {
       setTimeout(check, INTERVAL);
       timeSoFar += INTERVAL;
-    }
-    // just "fail" silently if maxTime exceeded - callback will never be called
+    } // just "fail" silently if maxTime exceeded - callback will never be called
+
   };
 
   check();
 };
+
 const isRadio = element => {
   return element.hasAttribute("type") && element.getAttribute("type") === "radio";
 };
+
 const getRadioElementToFocus = (groupName, shiftKey) => {
   const buttonsInGroup = document.querySelectorAll(`input[type="radio"][name="${groupName}"]`);
   const selectedButton = [...buttonsInGroup].find(button => button.checked);
+
   if (selectedButton) {
     return selectedButton;
   }
+
   return buttonsInGroup[shiftKey ? buttonsInGroup.length - 1 : 0];
 };
+
 const getNextElement = (element, focusableElements, shiftKey) => {
   const currentIndex = focusableElements.indexOf(element);
+
   if (currentIndex === -1) {
     // we're not currently on a focusable element - most likely because the focusableElements come from a different focus trap!
     // So we need to leave focus where it is.
@@ -41,20 +50,27 @@ const getNextElement = (element, focusableElements, shiftKey) => {
     if (element === document.body) {
       return focusableElements[0];
     }
+
     return element;
   }
+
   const increment = shiftKey ? -1 : 1;
   let nextIndex = currentIndex;
   let foundElement;
+
   while (!foundElement) {
     nextIndex += increment;
+
     if (nextIndex < 0) {
       nextIndex += focusableElements.length;
     }
+
     if (nextIndex >= focusableElements.length) {
       nextIndex -= focusableElements.length;
     }
+
     const nextElement = focusableElements[nextIndex];
+
     if (nextElement === element) {
       // guard in case there is only one focusable element (or only a single radio group) in the trap.
       // If this happens we don't want to freeze the browser by looping forever, and it's OK to just focus
@@ -65,20 +81,21 @@ const getNextElement = (element, focusableElements, shiftKey) => {
       if (isRadio(element) && document.activeElement !== element) {
         return getRadioElementToFocus(element.getAttribute("name"), shiftKey);
       }
+
       return element;
     }
+
     if (isRadio(nextElement)) {
       // if we've reached a radio element we need to ensure we focus the correct button in its group
       const nextElementGroupName = nextElement.getAttribute("name");
+
       if (isRadio(element)) {
-        const groupName = element.getAttribute("name");
+        const groupName = element.getAttribute("name"); // if the name is different we're in a new group so can focus the appropriate button in it*/
 
-        // if the name is different we're in a new group so can focus the appropriate button in it*/
         if (nextElementGroupName !== groupName) {
           foundElement = getRadioElementToFocus(nextElementGroupName, shiftKey);
-        }
+        } // otherwise we're still in the same radio group so need to continue the loop
 
-        // otherwise we're still in the same radio group so need to continue the loop
       } else {
         // if we've moved into a radio group from a non-radio starting point, we still have to ensure we focus
         // the correct button in the group
@@ -89,6 +106,8 @@ const getNextElement = (element, focusableElements, shiftKey) => {
       foundElement = nextElement;
     }
   }
+
   return foundElement;
 };
+
 export { defaultFocusableSelectors, getNextElement, setElementFocus };

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

@@ -2,9 +2,7 @@ import React, { useCallback, useContext, useEffect, useLayoutEffect, useMemo, us
 import PropTypes from "prop-types";
 import { defaultFocusableSelectors, getNextElement, setElementFocus } from "./focus-trap-utils";
 import { ModalContext } from "../../components/modal/modal.component";
-import usePrevious from "../../hooks/__internal__/usePrevious";
-
-// TODO investigate why React.RefObject<T> produces a failed prop type when current = null
+import usePrevious from "../../hooks/__internal__/usePrevious"; // TODO investigate why React.RefObject<T> produces a failed prop type when current = null
 
 const FocusTrap = ({
   children,
@@ -29,6 +27,7 @@ const FocusTrap = ({
     if (!focusableElements || candidate.length !== focusableElements.length) {
       return true;
     }
+
     return Array.from(candidate).some((el, i) => el !== focusableElements[i]);
   }, [focusableElements]);
   const trapWrappers = useMemo(() => additionalWrapperRefs !== null && additionalWrapperRefs !== void 0 && additionalWrapperRefs.length ? [wrapperRef, ...additionalWrapperRefs] : [wrapperRef], [additionalWrapperRefs, wrapperRef]);
@@ -40,6 +39,7 @@ const FocusTrap = ({
         elements.push(...Array.from(ref.querySelectorAll(focusableSelectors || defaultFocusableSelectors)).filter(el => Number(el.tabIndex) !== -1));
       }
     });
+
     if (hasNewInputs(elements)) {
       setFocusableElements(Array.from(elements));
       setFirstElement(elements[0]);
@@ -77,7 +77,9 @@ const FocusTrap = ({
         bespokeTrap(ev, firstElement, lastElement);
         return;
       }
+
       const activeElement = document.activeElement;
+
       if (ev.key === "Tab") {
         if (!(focusableElements !== null && focusableElements !== void 0 && focusableElements.length)) {
           /* Block the trap */
@@ -85,11 +87,13 @@ const FocusTrap = ({
         } else if (ev.shiftKey) {
           /* shift + tab */
           let elementToFocus;
+
           if (activeElement === (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current)) {
             elementToFocus = getNextElement(firstElement, focusableElements, ev.shiftKey);
           } else {
             elementToFocus = getNextElement(activeElement, focusableElements, ev.shiftKey);
           }
+
           setElementFocus(elementToFocus);
           ev.preventDefault();
         } else if (activeElement === (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current)) {
@@ -103,6 +107,7 @@ const FocusTrap = ({
         }
       }
     };
+
     document.addEventListener("keydown", trapFn, true);
     return function cleanup() {
       document.removeEventListener("keydown", trapFn, true);
@@ -110,12 +115,14 @@ const FocusTrap = ({
   }, [firstElement, lastElement, focusableElements, bespokeTrap, wrapperRef]);
   const updateCurrentFocusedElement = useCallback(() => {
     const element = focusableElements === null || focusableElements === void 0 ? void 0 : focusableElements.find(el => el === document.activeElement);
+
     if (element) {
       setCurrentFocusedElement(element);
     }
   }, [focusableElements]);
   const refocusTrap = useCallback(() => {
     var _wrapperRef$current;
+
     /* istanbul ignore else */
     if (currentFocusedElement && !currentFocusedElement.hasAttribute("disabled")) {
       // the trap breaks if it tries to refocus a disabled element
@@ -138,23 +145,25 @@ const FocusTrap = ({
       setTabIndex(0);
     }
   }, [isOpen]);
+
   const onBlur = () => {
     /* istanbul ignore else */
     if (isOpen) {
       setTabIndex(undefined);
     }
   };
-  const focusProps = hasNoTabIndex => ({
-    ...(hasNoTabIndex && {
+
+  const focusProps = hasNoTabIndex => ({ ...(hasNoTabIndex && {
       tabIndex,
       onBlur
     }),
     onFocus: updateCurrentFocusedElement
-  });
+  }); // passes focusProps, sets tabIndex and onBlur if no tabIndex has been expicitly set on child
+
 
-  // passes focusProps, sets tabIndex and onBlur if no tabIndex has been expicitly set on child
   const clonedChildren = React.Children.map(children, child => {
     var _focusableChild$props;
+
     const focusableChild = child;
     return /*#__PURE__*/React.cloneElement(focusableChild, focusProps((focusableChild === null || focusableChild === void 0 ? void 0 : (_focusableChild$props = focusableChild.props) === null || _focusableChild$props === void 0 ? void 0 : _focusableChild$props.tabIndex) === undefined));
   });
@@ -162,6 +171,7 @@ const FocusTrap = ({
     ref: trapRef
   }, clonedChildren);
 };
+
 FocusTrap.propTypes = {
   "additionalWrapperRefs": PropTypes.arrayOf(PropTypes.shape({
     "current": function (props, propName) {

package/esm/__internal__/form-field/form-field.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, { useContext, useEffect, useMemo } from "react";
 import PropTypes from "prop-types";
 import invariant from "invariant";
@@ -9,6 +10,7 @@ import FieldHelp from "../field-help";
 import tagComponent from "../utils/helpers/tags/tags";
 import { TabContext } from "../../components/tabs/tab";
 import useIsAboveBreakpoint from "../../hooks/__internal__/useIsAboveBreakpoint";
+
 const FormField = ({
   children,
   "data-component": dataComponent,
@@ -50,9 +52,11 @@ const FormField = ({
   !(invalidValidationProp === undefined) ? process.env.NODE_ENV !== "production" ? invariant(false, `Prop \`${invalidValidationProp}\` cannot be used in conjunction with \`disabled\`. ` + "Use `readOnly` if you require users to see validations with a non-interactive field") : invariant(false) : void 0;
   const largeScreen = useIsAboveBreakpoint(adaptiveLabelBreakpoint);
   let inlineLabel = labelInline;
+
   if (adaptiveLabelBreakpoint) {
     inlineLabel = largeScreen;
   }
+
   const {
     setError,
     setWarning,
@@ -92,6 +96,7 @@ const FormField = ({
     validationIconId: validationIconId
   }, label), fieldHelpInline && fieldHelp, !reverse && children), !fieldHelpInline && fieldHelp);
 };
+
 FormField.propTypes = {
   "adaptiveLabelBreakpoint": PropTypes.number,
   "children": PropTypes.node,

package/esm/__internal__/full-screen-heading/full-screen-heading.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 tagComponent from "../utils/helpers/tags/tags";

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

@@ -3,6 +3,7 @@ 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 = ({
   children,
   positionedChildren,
@@ -29,14 +30,17 @@ const InputPresentation = ({
     onMouseEnter: onGroupMouseEnter,
     onMouseLeave: onGroupMouseLeave
   } = useContext(InputGroupContext);
+
   const handleMouseEnter = () => {
     if (onMouseEnter) onMouseEnter();
     if (onGroupMouseEnter) onGroupMouseEnter();
   };
+
   const handleMouseLeave = () => {
     if (onMouseLeave) onMouseLeave();
     if (onGroupMouseLeave) onGroupMouseLeave();
   };
+
   return /*#__PURE__*/React.createElement(StyledInputPresentationContainer, {
     inputWidth: inputWidth
   }, positionedChildren, /*#__PURE__*/React.createElement(InputPresentationStyle, {
@@ -56,6 +60,7 @@ const InputPresentation = ({
     hasIcon: hasIcon
   }, children));
 };
+
 InputPresentation.propTypes = {
   "align": PropTypes.string,
   "children": PropTypes.node,

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

@@ -8,6 +8,7 @@ export const StyledInputPresentationContainer = styled.div`
   display: flex;
   position: relative;
 `;
+
 function stylingForValidations({
   error,
   warning,
@@ -16,9 +17,11 @@ function stylingForValidations({
   validationRedesignOptIn
 }) {
   let validationColor;
+
   if (disabled) {
     return "";
   }
+
   if (error) {
     validationColor = "var(--colorsSemanticNegative500)";
   } else if (warning) {
@@ -28,12 +31,14 @@ function stylingForValidations({
   } else {
     return "";
   }
+
   return css`
     border-color: ${validationColor} !important;
     z-index: 1;
     ${error && `box-shadow: inset 1px 1px 0 ${validationColor}, inset -1px -1px 0 ${validationColor};`}
   `;
 }
+
 const InputPresentationStyle = styled.div`
   align-items: stretch;
   background: var(--colorsUtilityYang100);

package/esm/__internal__/input/input.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, { useEffect, useContext, useRef } from "react";
 import PropTypes from "prop-types";
 import StyledInput from "./input.style";
 import { InputContext, InputGroupContext } from "../input-behaviour";
+
 function selectTextOnFocus(input) {
   // setTimeout is required so the dom has a chance to place the cursor in the input
   setTimeout(() => {
@@ -14,8 +16,8 @@ function selectTextOnFocus(input) {
       } = input.current;
       const {
         length
-      } = value;
-      // only select text if cursor is at the very end or the very start of the value
+      } = value; // only select text if cursor is at the very end or the very start of the value
+
       if (selectionStart === 0 && selectionEnd === 0 || selectionStart === length && selectionEnd === length) {
         if (document.activeElement === input.current) {
           input.current.setSelectionRange(0, length);
@@ -24,6 +26,7 @@ function selectTextOnFocus(input) {
     }
   });
 }
+
 const Input = /*#__PURE__*/React.forwardRef(({
   align,
   placeholder,
@@ -46,9 +49,11 @@ const Input = /*#__PURE__*/React.forwardRef(({
   const groupContext = useContext(InputGroupContext);
   const deferredTimeout = useRef(null);
   let input = useRef(null);
+
   if (ref) {
     input = ref;
   }
+
   useEffect(() => {
     if (autoFocus && input.current) {
       input.current.focus();
@@ -69,54 +74,69 @@ const Input = /*#__PURE__*/React.forwardRef(({
       context.onBlur();
     }
   }, [disabled, context]);
+
   const handleClick = ev => {
     var _input, _input$current;
+
     if (onClick) {
       onClick(ev);
     }
+
     (_input = input) === null || _input === void 0 ? void 0 : (_input$current = _input.current) === null || _input$current === void 0 ? void 0 : _input$current.focus();
   };
+
   const handleFocus = ev => {
     if (onFocus) {
       onFocus(ev);
     }
+
     if (context.onFocus) {
       context.onFocus();
     }
+
     if (groupContext.onFocus) {
       groupContext.onFocus();
     }
+
     if (type === "text") {
       selectTextOnFocus(input);
     }
   };
+
   const handleBlur = ev => {
     if (onBlur) {
       onBlur(ev);
     }
+
     if (context.onBlur) {
       context.onBlur();
     }
+
     if (groupContext.onBlur) {
       groupContext.onBlur();
     }
   };
+
   const handleDeferred = ev => {
     if (onChangeDeferred) {
       if (deferredTimeout.current) {
         clearTimeout(deferredTimeout.current);
       }
+
       deferredTimeout.current = setTimeout(() => {
         onChangeDeferred(ev);
       }, deferTimeout || 750);
     }
   };
+
   const handleChange = ev => {
     if (onChange) {
       onChange(ev);
     }
+
     handleDeferred(ev);
   };
+
   return /*#__PURE__*/React.createElement(StyledInput, _extends({}, rest, {
     "aria-labelledby": context.ariaLabelledBy,
     align: align,
@@ -201,6 +221,9 @@ Input.propTypes = {
   "contentEditable": PropTypes.oneOfType([PropTypes.oneOf(["false", "inherit", "true"]), PropTypes.bool]),
   "contextMenu": PropTypes.string,
   "crossOrigin": PropTypes.string,
+  "css": PropTypes.oneOfType([PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__emotion_styles": PropTypes.any.isRequired
+  }), PropTypes.string, PropTypes.bool]),
   "dangerouslySetInnerHTML": PropTypes.shape({
     "__html": PropTypes.string.isRequired
   }),

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

@@ -3,6 +3,7 @@ import PropTypes from "prop-types";
 import { InlineInputsContext } from "../../components/inline-inputs";
 import useInputBehaviour from "./useInputBehaviour";
 const InputContext = /*#__PURE__*/React.createContext({});
+
 const InputBehaviour = ({
   children
 }) => {
@@ -11,12 +12,12 @@ const InputBehaviour = ({
     ariaLabelledBy
   } = useContext(InlineInputsContext);
   return /*#__PURE__*/React.createElement(InputContext.Provider, {
-    value: {
-      ...contextValue,
+    value: { ...contextValue,
       ariaLabelledBy
     }
   }, children);
 };
+
 InputBehaviour.propTypes = {
   "children": PropTypes.node
 };

package/esm/__internal__/input-behaviour/input-group-behaviour.component.js

@@ -2,6 +2,7 @@ import React from "react";
 import PropTypes from "prop-types";
 import useInputBehaviour from "./useInputBehaviour";
 const InputGroupContext = /*#__PURE__*/React.createContext({});
+
 const InputGroupBehaviour = ({
   children,
   blockGroupBehaviour
@@ -11,6 +12,7 @@ const InputGroupBehaviour = ({
     value: contextValue
   }, children);
 };
+
 InputGroupBehaviour.propTypes = {
   "blockGroupBehaviour": PropTypes.bool,
   "children": PropTypes.node

package/esm/__internal__/input-behaviour/useInputBehaviour.js

@@ -1,4 +1,5 @@
 import { useState, useRef, useCallback, useMemo } from "react";
+
 const useInputBehaviour = blockGroupBehaviour => {
   const [hasFocus, setHasFocus] = useState(false);
   const [hasMouseOver, setHasMouseOver] = useState(false);
@@ -7,12 +8,12 @@ const useInputBehaviour = blockGroupBehaviour => {
   const onBlur = useCallback(() => setHasFocus(false), []);
   const assignInput = useCallback(input => {
     inputRef.current = input.current;
-  }, []);
+  }, []); // use mouse down rather than click to accommodate click and drag events too
 
-  // use mouse down rather than click to accommodate click and drag events too
   const onMouseDown = useCallback(() => {
     requestAnimationFrame(() => {
       var _inputRef$current;
+
       inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus({
         preventScroll: true
       });
@@ -32,4 +33,5 @@ const useInputBehaviour = blockGroupBehaviour => {
   }), [hasFocus, hasMouseOver, onFocus, onBlur, onMouseDown, blockGroupBehaviour, onMouseEnter, onMouseLeave, assignInput]);
   return contextValue;
 };
+
 export default useInputBehaviour;