carbon-react 119.9.3 → 119.10.1

package/lib/components/select/select.style.js

@@ -14,16 +14,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const StyledSelect = _styledComponents.default.div`
-  ${_ref => {
-  let {
-    hasTextCursor,
-    disabled,
-    readOnly,
-    theme,
-    transparent,
-    isOpen
-  } = _ref;
-  return (0, _styledComponents.css)`
+  ${({
+  hasTextCursor,
+  disabled,
+  readOnly,
+  theme,
+  transparent,
+  isOpen
+}) => (0, _styledComponents.css)`
     ${_styledSystem.margin}
 
     position: relative;
@@ -83,8 +81,7 @@ const StyledSelect = _styledComponents.default.div`
         opacity: 0;
       }
     `}
-  `;
-}}
+  `}
 `;
 StyledSelect.defaultProps = {
   size: "medium",

package/lib/components/select/simple-select/simple-select.component.js

@@ -24,43 +24,42 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 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); }
 let deprecateInputRefWarnTriggered = false;
 let deprecateUncontrolledWarnTriggered = false;
-const SimpleSelect = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
-  let {
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledby,
-    value,
-    defaultValue,
-    id,
-    label,
-    name,
-    disabled,
-    readOnly,
-    children,
-    transparent,
-    openOnFocus = false,
-    onOpen,
-    onChange,
-    onClick,
-    onFocus,
-    onKeyDown,
-    onBlur,
-    disablePortal = false,
-    isLoading,
-    listMaxHeight,
-    onListScrollBottom,
-    tableHeader,
-    multiColumn,
-    tooltipPosition,
-    "data-component": dataComponent = "simple-select",
-    "data-element": dataElement,
-    "data-role": dataRole,
-    listPlacement = "bottom",
-    flipEnabled = true,
-    inputRef,
-    enableVirtualScroll,
-    virtualScrollOverscan,
-    ...props
-  } = _ref;
+const SimpleSelect = /*#__PURE__*/_react.default.forwardRef(({
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledby,
+  value,
+  defaultValue,
+  id,
+  label,
+  name,
+  disabled,
+  readOnly,
+  children,
+  transparent,
+  openOnFocus = false,
+  onOpen,
+  onChange,
+  onClick,
+  onFocus,
+  onKeyDown,
+  onBlur,
+  disablePortal = false,
+  isLoading,
+  listMaxHeight,
+  onListScrollBottom,
+  tableHeader,
+  multiColumn,
+  tooltipPosition,
+  "data-component": dataComponent = "simple-select",
+  "data-element": dataElement,
+  "data-role": dataRole,
+  listPlacement = "bottom",
+  flipEnabled = true,
+  inputRef,
+  enableVirtualScroll,
+  virtualScrollOverscan,
+  ...props
+}, ref) => {
   const selectListId = (0, _react.useRef)((0, _guid.default)());
   const containerRef = (0, _react.useRef)(null);
   const listboxRef = (0, _react.useRef)(null);

package/lib/components/select/utils/get-next-child-by-text.js

@@ -28,8 +28,7 @@ function getIndexOfNextElement(listOfMatches, previousIndex) {
 /**
  * Recreates HTML Select element functionality of finding first match based on typed characters
  * */
-function getNextChildByText(textToMatch, arrayOfChildren) {
-  let previousIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : -1;
+function getNextChildByText(textToMatch, arrayOfChildren, previousIndex = -1) {
   const lastCharacter = textToMatch.slice(-1);
   const isTheSameCharacter = textToMatch.split("").every(character => character === lastCharacter);
   let indexOfMatch = findElementStartingWithText(textToMatch, arrayOfChildren);

package/lib/components/select/utils/with-filter.hoc.js

@@ -90,16 +90,15 @@ function addHighlightedContent(filteredElements, filterText) {
 }
 /** Filters wrapped component children based on provided filter text and highlights matching content */
 const withFilter = WrappedComponent => {
-  const FilteredComponent = /*#__PURE__*/_react.default.forwardRef((_ref, forwardedRef) => {
-    let {
-      children,
-      filterText,
-      noResultsMessage,
-      isLoading,
-      multiColumn,
-      tableHeader,
-      ...props
-    } = _ref;
+  const FilteredComponent = /*#__PURE__*/_react.default.forwardRef(({
+    children,
+    filterText,
+    noResultsMessage,
+    isLoading,
+    multiColumn,
+    tableHeader,
+    ...props
+  }, forwardedRef) => {
     const l = (0, _useLocale.default)();
     const getFilteredChildren = (0, _react.useCallback)(() => {
       let filteredElements = children;

package/lib/components/settings-row/settings-row.component.js

@@ -12,16 +12,15 @@ var _utils = require("../../style/utils");
 var _settingsRow = require("./settings-row.style");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
-const SettingsRow = _ref => {
-  let {
-    title,
-    headingType = "h3",
-    children,
-    description,
-    divider = true,
-    className,
-    ...rest
-  } = _ref;
+const SettingsRow = ({
+  title,
+  headingType = "h3",
+  children,
+  description,
+  divider = true,
+  className,
+  ...rest
+}) => {
   const heading = () => {
     if (!title) return null;
     return /*#__PURE__*/_react.default.createElement(_heading.default, {

package/lib/components/settings-row/settings-row.style.js

@@ -22,15 +22,12 @@ const StyledSettingsRow = _styledComponents.default.div`
   padding: 0;
   position: relative;
 
-  ${_ref => {
-  let {
-    hasDivider
-  } = _ref;
-  return hasDivider && (0, _styledComponents.css)`
+  ${({
+  hasDivider
+}) => hasDivider && (0, _styledComponents.css)`
       border-bottom: 1px solid var(--colorsUtilityMajor050);
       padding-bottom: 30px;
-    `;
-}}
+    `}
 
   ${_heading.StyledHeader} {
     margin-bottom: 0;

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

@@ -21,31 +21,30 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
 let deprecateWarnTriggered = false;
-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;
+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
+}) => {
   if (!deprecateWarnTriggered) {
     deprecateWarnTriggered = true;
     _logger.default.deprecate("The ShowEditPod component is deprecated and will soon be removed. Please use alternatives such as the Fieldset, Form or Pod components instead.");

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

@@ -9,20 +9,17 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _sidebarHeader = _interopRequireDefault(require("./sidebar-header.style"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
-const SidebarHeader = _ref => {
-  let {
-    children,
-    id,
-    closeIcon,
-    ...rest
-  } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_sidebarHeader.default, _extends({
-    hasClose: !!closeIcon,
-    id: id,
-    "data-component": "sidebar-header",
-    p: "27px 32px 32px"
-  }, rest), children, closeIcon);
-};
+const SidebarHeader = ({
+  children,
+  id,
+  closeIcon,
+  ...rest
+}) => /*#__PURE__*/_react.default.createElement(_sidebarHeader.default, _extends({
+  hasClose: !!closeIcon,
+  id: id,
+  "data-component": "sidebar-header",
+  p: "27px 32px 32px"
+}, rest), children, closeIcon);
 SidebarHeader.displayName = "SidebarHeader";
 var _default = SidebarHeader;
 exports.default = _default;

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

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

package/lib/components/sidebar/sidebar.component.js

@@ -26,29 +26,28 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 const SidebarContext = /*#__PURE__*/_react.default.createContext({});
 exports.SidebarContext = SidebarContext;
-const Sidebar = /*#__PURE__*/_react.default.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 Sidebar = /*#__PURE__*/_react.default.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 locale = (0, _useLocale.default)();
   const {
     current: headerId

package/lib/components/sidebar/sidebar.style.js

@@ -29,15 +29,13 @@ const StyledSidebar = _styledComponents.default.div`
     ${props => (0, _formStyleUtils.calculateFormSpacingValues)(props, false, "sidebar")}
   }
 
-  ${_ref => {
-  let {
-    onCancel,
-    position,
-    size,
-    theme,
-    width
-  } = _ref;
-  return (0, _styledComponents.css)`
+  ${({
+  onCancel,
+  position,
+  size,
+  theme,
+  width
+}) => (0, _styledComponents.css)`
     background: var(--colorsUtilityMajor025);
     border-radius: 1px;
     bottom: 0;
@@ -51,8 +49,8 @@ const StyledSidebar = _styledComponents.default.div`
       width: ${_sidebar.SIDEBAR_SIZES_CSS[size]};
     `}
     ${width && (0, _width.default)({
-    width
-  })}
+  width
+})}
 
     ${position && (0, _styledComponents.css)`
       box-shadow: var(--boxShadow300);
@@ -67,8 +65,7 @@ const StyledSidebar = _styledComponents.default.div`
         top: 25px;
       }
     `}
-  `;
-}}
+  `}
 `;
 StyledSidebar.defaultProps = {
   theme: _base.default

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

@@ -32,26 +32,20 @@ const StyledColorSampleBox = _styledComponents.default.div`
   justify-content: center;
   border: 2px solid transparent;
 
-  ${_ref => {
-  let {
-    color
-  } = _ref;
-  return color !== "transparent" && (0, _styledComponents.css)`
+  ${({
+  color
+}) => color !== "transparent" && (0, _styledComponents.css)`
       background-color: ${color};
-    `;
-}}
+    `}
 
-  ${_ref2 => {
-  let {
-    color
-  } = _ref2;
-  return color === "transparent" && (0, _styledComponents.css)`
+  ${({
+  color
+}) => color === "transparent" && (0, _styledComponents.css)`
       background-color: #eeeeee;
       background-image: url(${_checkerBoard.default});
       background-size: 14px 14px;
       background-position: -2px -2px;
-    `;
-}}
+    `}
 `;
 exports.StyledColorSampleBox = StyledColorSampleBox;
 const StyledSimpleColorInput = (0, _styledComponents.default)(_input.Input)`
@@ -95,12 +89,9 @@ const StyledTickIcon = (0, _styledComponents.default)(_icon.default)`
 
   &::before {
     font-size: 20px;
-    color: ${_ref3 => {
-  let {
-    color
-  } = _ref3;
-  return getIconColor(color);
-}};
+    color: ${({
+  color
+}) => getIconColor(color)};
   }
 `;
 exports.StyledTickIcon = StyledTickIcon;

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

@@ -190,26 +190,23 @@ const SimpleColorPicker = /*#__PURE__*/_react.default.forwardRef((props, ref) =>
     role: "radiogroup",
     legend: legend,
     isRequired: required
-  }, validationOnLegend && validationProps, (0, _tags.default)("simple-color-picker", props), (0, _utils.filterStyledSystemMarginProps)(rest)), /*#__PURE__*/_react.default.createElement(_simpleColorPicker.StyledContent, null, /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupContext.Consumer, null, _ref => {
-    let {
-      onMouseEnter,
-      onMouseLeave
-    } = _ref;
-    return /*#__PURE__*/_react.default.createElement(_simpleColorPicker.StyledColorOptions, _extends({
-      maxWidth: maxWidth,
-      childWidth: childWidth,
-      ref: internalRef,
-      onMouseEnter: onMouseEnter,
-      onMouseLeave: onMouseLeave
-    }, validationProps), /*#__PURE__*/_react.default.createElement(_radioButtonMapper.default, {
-      name: name,
-      value: value,
-      onChange: onChange,
-      onMouseDown: handleOnMouseDown,
-      onKeyDown: onKeyDownHandler,
-      onBlur: handleOnBlur
-    }, navigationGrid));
-  }), !validationOnLegend && /*#__PURE__*/_react.default.createElement(_validationIcon.default, _extends({}, validationProps, {
+  }, validationOnLegend && validationProps, (0, _tags.default)("simple-color-picker", props), (0, _utils.filterStyledSystemMarginProps)(rest)), /*#__PURE__*/_react.default.createElement(_simpleColorPicker.StyledContent, null, /*#__PURE__*/_react.default.createElement(_inputBehaviour.InputGroupContext.Consumer, null, ({
+    onMouseEnter,
+    onMouseLeave
+  }) => /*#__PURE__*/_react.default.createElement(_simpleColorPicker.StyledColorOptions, _extends({
+    maxWidth: maxWidth,
+    childWidth: childWidth,
+    ref: internalRef,
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave
+  }, validationProps), /*#__PURE__*/_react.default.createElement(_radioButtonMapper.default, {
+    name: name,
+    value: value,
+    onChange: onChange,
+    onMouseDown: handleOnMouseDown,
+    onKeyDown: onKeyDownHandler,
+    onBlur: handleOnBlur
+  }, navigationGrid))), !validationOnLegend && /*#__PURE__*/_react.default.createElement(_validationIcon.default, _extends({}, validationProps, {
     tooltipFlipOverrides: ["top", "bottom"]
   }))));
 });

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

@@ -21,13 +21,10 @@ const StyledContent = _styledComponents.default.div`
 `;
 exports.StyledContent = StyledContent;
 const StyledColorOptions = _styledComponents.default.div`
-  max-width: ${_ref => {
-  let {
-    maxWidth,
-    childWidth
-  } = _ref;
-  return getRoundedMaxWidth(maxWidth, childWidth);
-}}px;
+  max-width: ${({
+  maxWidth,
+  childWidth
+}) => getRoundedMaxWidth(maxWidth, childWidth)}px;
 
   padding: 0;
   display: flex;
@@ -35,12 +32,11 @@ const StyledColorOptions = _styledComponents.default.div`
   border-left: ${BORDER_WIDTH}px solid transparent;
   border-top: ${BORDER_WIDTH}px solid transparent;
 
-  ${_ref2 => {
-  let {
-    error,
-    info,
-    warning
-  } = _ref2;
+  ${({
+  error,
+  info,
+  warning
+}) => {
   if (error) return (0, _styledComponents.css)`
         outline: var(--borderWidth200) solid var(--colorsSemanticNegative500);
       `;

package/lib/components/split-button/split-button-children.style.js

@@ -38,13 +38,11 @@ const borderRadiusStyling = `
 exports.borderRadiusStyling = borderRadiusStyling;
 const StyledSplitButtonChildrenContainer = _styledComponents.default.div`
   border-radius: var(--borderRadius100);
-  ${_ref => {
-  let {
-    theme,
-    align,
-    minWidth
-  } = _ref;
-  return (0, _styledComponents.css)`
+  ${({
+  theme,
+  align,
+  minWidth
+}) => (0, _styledComponents.css)`
     background-color: var(--colorsActionMajorYang100);
     min-width: ${minWidth}px;
     white-space: nowrap;
@@ -65,8 +63,7 @@ const StyledSplitButtonChildrenContainer = _styledComponents.default.div`
         margin-top: 3px;
       }
     }
-  `;
-}}
+  `}
 `;
 StyledSplitButtonChildrenContainer.defaultProps = {
   theme: _base.default

package/lib/components/split-button/split-button-toggle.style.js

@@ -16,14 +16,12 @@ const horizontalPaddingSizes = {
   large: 14
 };
 const StyledSplitButtonToggle = (0, _styledComponents.default)(_button.default)`
-  ${_ref => {
-  let {
-    buttonType,
-    disabled,
-    displayed,
-    size
-  } = _ref;
-  return (0, _styledComponents.css)`
+  ${({
+  buttonType,
+  disabled,
+  displayed,
+  size
+}) => (0, _styledComponents.css)`
     border-top-left-radius: var(--borderRadius000);
     border-bottom-left-radius: var(--borderRadius000);
 
@@ -78,8 +76,7 @@ const StyledSplitButtonToggle = (0, _styledComponents.default)(_button.default)`
         color: var(--colorsActionMajorYang100);
       }
     }
-  `;
-}}
+  `}
 `;
 var _default = StyledSplitButtonToggle;
 exports.default = _default;

package/lib/components/split-button/split-button.component.js

@@ -24,22 +24,21 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 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); }
 const CONTENT_WIDTH_RATIO = 0.75;
-const SplitButton = _ref => {
-  let {
-    align = "left",
-    buttonType = "secondary",
-    children,
-    disabled = false,
-    iconPosition = "before",
-    iconType,
-    onClick,
-    size = "medium",
-    subtext,
-    text,
-    "data-element": dataElement,
-    "data-role": dataRole,
-    ...rest
-  } = _ref;
+const SplitButton = ({
+  align = "left",
+  buttonType = "secondary",
+  children,
+  disabled = false,
+  iconPosition = "before",
+  iconType,
+  onClick,
+  size = "medium",
+  subtext,
+  text,
+  "data-element": dataElement,
+  "data-role": dataRole,
+  ...rest
+}) => {
   const theme = (0, _react.useContext)(_styledComponents.ThemeContext) || _themes.baseTheme;
   const buttonLabelId = (0, _react.useRef)((0, _guid.default)());
   const toggleButton = (0, _react.useRef)(null);