carbon-react 118.5.0 → 118.5.2

package/esm/components/show-edit-pod/show-edit-pod.component.js

@@ -12,86 +12,76 @@ import StyledPod from "./show-edit-pod.style";
 import Logger from "../../__internal__/utils/logger";
 const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
 let deprecateWarnTriggered = false;
-
-const ShowEditPod = ({
-  border = false,
-  className,
-  children,
-  saving = false,
-  editFields,
-  editing,
-  onEdit,
-  onSave,
-  onCancel,
-  onUndo,
-  cancel = true,
-  cancelText,
-  saveText,
-  onDelete,
-  deleteText,
-  softDelete,
-  buttonAlign = "right",
-  transitionName = "carbon-show-edit-pod__transition",
-  title,
-  hideDeleteButtonInViewMode = false,
-  variant = "transparent",
-  ...rest
-}) => {
+const ShowEditPod = _ref => {
+  let {
+    border = false,
+    className,
+    children,
+    saving = false,
+    editFields,
+    editing,
+    onEdit,
+    onSave,
+    onCancel,
+    onUndo,
+    cancel = true,
+    cancelText,
+    saveText,
+    onDelete,
+    deleteText,
+    softDelete,
+    buttonAlign = "right",
+    transitionName = "carbon-show-edit-pod__transition",
+    title,
+    hideDeleteButtonInViewMode = false,
+    variant = "transparent",
+    ...rest
+  } = _ref;
   if (!deprecateWarnTriggered) {
     deprecateWarnTriggered = true;
     Logger.deprecate("The ShowEditPod component is deprecated and will soon be removed. Please use alternatives such as the Fieldset, Form or Pod components instead.");
   }
-
   const locale = useContext(LocaleContext);
   const ref = useRef();
   const editModeNodeRef = useRef();
   const showModeNodeRef = useRef();
   const [isEditing, setIsEditingState] = useState(false);
   const isControlled = editing !== undefined;
-
   const focusPod = () => {
     ref.current.focus();
   };
-
   useEffect(() => {
     if (editing) {
       focusPod();
     }
   }, [editing]);
   const isInEditMode = isControlled ? editing : isEditing;
-
   const toggleEditingState = newState => {
     if (!isControlled) {
       setIsEditingState(newState);
     }
   };
-
   const handleEdit = ev => {
     onEdit(ev);
     toggleEditingState(true);
     focusPod();
   };
-
   const onSaveEditForm = ev => {
     ev.preventDefault();
     onSave(ev);
     toggleEditingState(false);
   };
-
   const onCancelEditForm = ev => {
     if (onCancel) {
       onCancel(ev);
     }
-
     toggleEditingState(false);
   };
-
   const onKeyDown = ev => {
     if (Events.isEscKey(ev)) {
       onCancelEditForm(ev);
     }
   };
-
   const deleteButton = () => {
     const label = deleteText || locale.actions.delete();
     return /*#__PURE__*/React.createElement(Button, {
@@ -102,7 +92,6 @@ const ShowEditPod = ({
       onClick: onDelete
     }, label);
   };
-
   const editContent = () => /*#__PURE__*/React.createElement(Form, {
     onSubmit: onSaveEditForm,
     buttonAlignment: buttonAlign,
@@ -122,7 +111,6 @@ const ShowEditPod = ({
     rightSideButtons: onDelete ? deleteButton() : null,
     saving: saving
   }, editFields);
-
   const content = () => {
     if (isInEditMode) {
       return /*#__PURE__*/React.createElement(CSSTransition, {
@@ -138,7 +126,6 @@ const ShowEditPod = ({
         ref: editModeNodeRef
       }, editContent()));
     }
-
     return /*#__PURE__*/React.createElement(CSSTransition, {
       key: "2",
       classNames: transitionName,
@@ -152,7 +139,6 @@ const ShowEditPod = ({
       ref: showModeNodeRef
     }, children));
   };
-
   const universalProps = () => ({
     size: "small",
     tabIndex: "-1",
@@ -166,8 +152,8 @@ const ShowEditPod = ({
     ...rest,
     ...tagComponent("show-edit-pod", rest)
   });
-
-  const contentProps = () => ({ ...universalProps(),
+  const contentProps = () => ({
+    ...universalProps(),
     ...(!hideDeleteButtonInViewMode && {
       onDelete
     }),
@@ -175,79 +161,56 @@ const ShowEditPod = ({
       onEdit: handleEdit
     })
   });
-
-  const editingProps = () => ({ ...universalProps(),
+  const editingProps = () => ({
+    ...universalProps(),
     onKeyDown
   });
-
   const podProps = () => isInEditMode ? editingProps() : contentProps();
-
   return /*#__PURE__*/React.createElement(StyledPod, podProps(), /*#__PURE__*/React.createElement(TransitionGroup, null, content()));
 };
-
-ShowEditPod.propTypes = { ...marginPropTypes,
-
+ShowEditPod.propTypes = {
+  ...marginPropTypes,
   /** Pod theme variant. */
   variant: PropTypes.oneOf(["primary", "secondary", "tertiary", "tile", "transparent"]),
-
   /** Enable/disable the border on the Pod. */
   border: PropTypes.bool,
-
   /** This component supports children. */
   children: PropTypes.node,
-
   /** Classes to apply to the component. */
   className: PropTypes.string,
-
   /** Allows developers to control the editing state manually. */
   editing: PropTypes.bool,
-
   /** Callback when edit button is clicked. */
   onEdit: PropTypes.func,
-
   /** A callback triggered when the delete action is clicked. */
   onDelete: PropTypes.func,
-
   /** A callback triggered when the undo action is clicked. */
   onUndo: PropTypes.func,
-
   /** Sets soft delete state. */
   softDelete: PropTypes.bool,
-
   /** Hide delete button in view mode. */
   hideDeleteButtonInViewMode: PropTypes.bool,
-
   /** Define fields to be rendered in the edit state */
   editFields: PropTypes.node,
-
   /** Define a custom transition between show and edit states */
   transitionName: PropTypes.string,
   // Props passed to Form
-
   /** A callback triggered after clicking the save button */
   onSave: PropTypes.func,
-
   /** Controls which direction the form buttons align */
   buttonAlign: PropTypes.oneOf(["left", "right"]),
-
   /** Set to false to hide the cancel button */
   cancel: PropTypes.bool,
-
   /** Supply custom text for the cancel button */
   cancelText: PropTypes.string,
-
   /** A callback triggered when the form is cancelled */
   onCancel: PropTypes.func,
-
   /** Supply custom text for the save button */
   saveText: PropTypes.string,
-
   /** Supply custom text for the delete button */
   deleteText: PropTypes.string,
-
   /** Can inform if the form is in a saving state (disables the save button) */
   saving: PropTypes.bool,
-
   /** Title to be displayed */
   title: PropTypes.node
 };

package/esm/components/sidebar/__internal__/sidebar-header/sidebar-header.component.d.ts

@@ -9,7 +9,7 @@ export interface SidebarHeaderProps extends PaddingProps {
     closeIcon?: React.ReactNode;
 }
 declare const SidebarHeader: {
-    ({ children, id, closeIcon, ...rest }: SidebarHeaderProps): JSX.Element;
+    ({ children, id, closeIcon, ...rest }: SidebarHeaderProps): React.JSX.Element;
     displayName: string;
 };
 export default SidebarHeader;

package/esm/components/sidebar/__internal__/sidebar-header/sidebar-header.component.js

@@ -1,179 +1,20 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 StyledSidebarHeader from "./sidebar-header.style";
-
-const SidebarHeader = ({
-  children,
-  id,
-  closeIcon,
-  ...rest
-}) => /*#__PURE__*/React.createElement(StyledSidebarHeader, _extends({
-  hasClose: !!closeIcon,
-  id: id,
-  "data-component": "sidebar-header",
-  p: "27px 32px 32px"
-}, rest), children, closeIcon);
-
-SidebarHeader.propTypes = {
-  "children": PropTypes.node,
-  "closeIcon": PropTypes.node,
-  "id": PropTypes.string.isRequired,
-  "p": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "padding": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "paddingBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "paddingLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "paddingRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "paddingTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "paddingX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "paddingY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "pb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "pl": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "pr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "pt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "px": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string]),
-  "py": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__@toStringTag": PropTypes.string.isRequired,
-    "description": PropTypes.string,
-    "toString": PropTypes.func.isRequired,
-    "valueOf": PropTypes.func.isRequired
-  }), PropTypes.string])
+const SidebarHeader = _ref => {
+  let {
+    children,
+    id,
+    closeIcon,
+    ...rest
+  } = _ref;
+  return /*#__PURE__*/React.createElement(StyledSidebarHeader, _extends({
+    hasClose: !!closeIcon,
+    id: id,
+    "data-component": "sidebar-header",
+    p: "27px 32px 32px"
+  }, rest), children, closeIcon);
 };
 SidebarHeader.displayName = "SidebarHeader";
 export default SidebarHeader;

package/esm/components/sidebar/__internal__/sidebar-header/sidebar-header.style.js

@@ -12,9 +12,11 @@ const StyledSidebarHeader = styled.div`
 
   ${padding}
 
-  ${({
-  hasClose
-}) => hasClose && css`
+  ${_ref => {
+  let {
+    hasClose
+  } = _ref;
+  return hasClose && css`
       display: flex;
       justify-content: space-between;
 
@@ -23,7 +25,8 @@ const StyledSidebarHeader = styled.div`
         z-index: 1;
         right: 25px;
       }
-    `}
+    `;
+}}
 `;
 StyledSidebarHeader.defaultProps = {
   theme: baseTheme

package/esm/components/sidebar/sidebar.component.js

@@ -1,5 +1,4 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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, { useCallback, useContext, useRef } from "react";
 import PropTypes from "prop-types";
 import Modal from "../modal";
@@ -13,31 +12,34 @@ import createGuid from "../../__internal__/utils/helpers/guid";
 import useLocale from "../../hooks/__internal__/useLocale";
 import { filterStyledSystemPaddingProps } from "../../style/utils";
 import useIsStickyFooterForm from "../../hooks/__internal__/useIsStickyFooterForm";
-import TopModalContext from "../carbon-provider/top-modal-context"; // TODO FE-5408 will investigate why React.RefObject<T> produces a failed prop type when current = null
+import TopModalContext from "../carbon-provider/top-modal-context";
+
+// TODO FE-5408 will investigate why React.RefObject<T> produces a failed prop type when current = null
 
 export const SidebarContext = /*#__PURE__*/React.createContext({});
-const Sidebar = /*#__PURE__*/React.forwardRef(({
-  "aria-describedby": ariaDescribedBy,
-  "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledBy,
-  open,
-  bespokeFocusTrap,
-  disableAutoFocus = false,
-  disableEscKey = false,
-  enableBackgroundUI = false,
-  header,
-  position = "right",
-  size = "medium",
-  children,
-  onCancel,
-  role = "dialog",
-  focusFirstElement,
-  focusableContainers,
-  focusableSelectors,
-  width,
-  headerPadding = {},
-  ...rest
-}, ref) => {
+const Sidebar = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    "aria-describedby": ariaDescribedBy,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    open,
+    bespokeFocusTrap,
+    disableAutoFocus = false,
+    disableEscKey = false,
+    enableBackgroundUI = false,
+    header,
+    position = "right",
+    size = "medium",
+    children,
+    onCancel,
+    role = "dialog",
+    focusFirstElement,
+    focusableContainers,
+    focusableSelectors,
+    width,
+    headerPadding = {},
+    ...rest
+  } = _ref;
   const locale = useLocale();
   const {
     current: headerId
@@ -53,7 +55,6 @@ const Sidebar = /*#__PURE__*/React.forwardRef(({
   const {
     topModal
   } = useContext(TopModalContext);
-
   const closeIcon = () => {
     if (!onCancel) return null;
     return /*#__PURE__*/React.createElement(IconButton, {
@@ -64,14 +65,13 @@ const Sidebar = /*#__PURE__*/React.forwardRef(({
       type: "close"
     }));
   };
-
   const componentTags = {
     "data-component": "sidebar",
     "data-element": rest["data-element"],
     "data-role": rest["data-role"]
   };
   const sidebar = /*#__PURE__*/React.createElement(StyledSidebar, _extends({
-    "aria-modal": !enableBackgroundUI && (topModal === null || topModal === void 0 ? void 0 : topModal.contains(sidebarRef.current)),
+    "aria-modal": !enableBackgroundUI && topModal?.contains(sidebarRef.current),
     "aria-describedby": ariaDescribedBy,
     "aria-label": ariaLabel,
     "aria-labelledby": !ariaLabelledBy && !ariaLabel ? headerId : ariaLabelledBy,

package/esm/components/sidebar/sidebar.style.js

@@ -20,13 +20,15 @@ const StyledSidebar = styled.div`
     ${props => calculateFormSpacingValues(props, false, "sidebar")}
   }
 
-  ${({
-  onCancel,
-  position,
-  size,
-  theme,
-  width
-}) => css`
+  ${_ref => {
+  let {
+    onCancel,
+    position,
+    size,
+    theme,
+    width
+  } = _ref;
+  return css`
     background: var(--colorsUtilityMajor025);
     border-radius: 1px;
     bottom: 0;
@@ -40,8 +42,8 @@ const StyledSidebar = styled.div`
       width: ${SIDEBAR_SIZES_CSS[size]};
     `}
     ${width && computeWidth({
-  width
-})}
+    width
+  })}
 
     ${position && css`
       box-shadow: var(--boxShadow300);
@@ -56,7 +58,8 @@ const StyledSidebar = styled.div`
         top: 25px;
       }
     `}
-  `}
+  `;
+}}
 `;
 StyledSidebar.defaultProps = {
   theme: baseTheme

package/esm/components/simple-color-picker/simple-color/simple-color.component.js

@@ -1,5 +1,4 @@
-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); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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, { useRef } from "react";
 import PropTypes from "prop-types";
 import guid from "../../../__internal__/utils/helpers/guid";

package/esm/components/simple-color-picker/simple-color/simple-color.style.js

@@ -22,20 +22,26 @@ export const StyledColorSampleBox = styled.div`
   justify-content: center;
   border: 2px solid transparent;
 
-  ${({
-  color
-}) => color !== "transparent" && css`
+  ${_ref => {
+  let {
+    color
+  } = _ref;
+  return color !== "transparent" && css`
       background-color: ${color};
-    `}
+    `;
+}}
 
-  ${({
-  color
-}) => color === "transparent" && css`
+  ${_ref2 => {
+  let {
+    color
+  } = _ref2;
+  return color === "transparent" && css`
       background-color: #eeeeee;
       background-image: url(${checkerBoardSvg});
       background-size: 14px 14px;
       background-position: -2px -2px;
-    `}
+    `;
+}}
 `;
 export const StyledSimpleColorInput = styled(Input)`
   position: absolute;
@@ -58,19 +64,17 @@ export const StyledSimpleColorInput = styled(Input)`
     border: 2px solid var(--colorsSemanticFocus500);
   }
 `;
-
 const getIconColor = color => {
   const rgbValues = getRgbValues(color);
-  const [r, g, b] = rgbValues; // color contrast calculating formula as per W3 suggestions
-
+  const [r, g, b] = rgbValues;
+  // color contrast calculating formula as per W3 suggestions
   const redMultiplier = 299,
-        greenMultiplier = 587,
-        blueMultiplier = 114;
+    greenMultiplier = 587,
+    blueMultiplier = 114;
   const contrast = (Math.round(r * redMultiplier) + Math.round(g * greenMultiplier) + Math.round(b * blueMultiplier)) / 1000;
   if (contrast < 128) return "var(--colorsUtilityYang100)";
   return "var(--colorsUtilityYin090)";
 };
-
 export const StyledTickIcon = styled(Icon)`
   height: 22px;
   width: 22px;
@@ -79,8 +83,11 @@ export const StyledTickIcon = styled(Icon)`
 
   &::before {
     font-size: 22px;
-    color: ${({
-  color
-}) => getIconColor(color)};
+    color: ${_ref3 => {
+  let {
+    color
+  } = _ref3;
+  return getIconColor(color);
+}};
   }
 `;