@zendeskgarden/react-notifications 9.12.3 → 9.12.4

package/dist/esm/styled/global-alert/StyledGlobalAlert.js

@@ -5,14 +5,13 @@
 * found at http://www.apache.org/licenses/LICENSE-2.0.
 */
 import styled, { css } from 'styled-components';
-import { componentStyles, getColor, focusStyles, getLineHeight } from '@zendeskgarden/react-theming';
+import { componentStyles, getLineHeight, getColor, focusStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'notifications.global_alert';
-const colorStyles = _ref => {
-  let {
-    theme,
-    $alertType
-  } = _ref;
+const COMPONENT_ID$5 = 'notifications.global_alert';
+const colorStyles$4 = ({
+  theme,
+  $alertType
+}) => {
   let borderColor;
   let backgroundColor;
   let foregroundColor;
@@ -136,7 +135,7 @@ const colorStyles = _ref => {
     }
   }), anchorHoverColor, anchorActiveColor);
 };
-const sizeStyles = props => {
+const sizeStyles$3 = props => {
   const {
     fontSizes,
     space
@@ -147,11 +146,11 @@ const sizeStyles = props => {
   return css(["padding:", "px;min-height:", "px;line-height:", ";font-size:", ";"], padding, minHeight, lineHeight, fontSizes.md);
 };
 const StyledGlobalAlert = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$5,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlert",
   componentId: "sc-k6rimt-0"
-})(["display:flex;flex-wrap:nowrap;overflow:auto;overflow-x:hidden;box-sizing:border-box;direction:", ";", " ", " && a{border-radius:", ";text-decoration:underline;}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', sizeStyles, colorStyles, props => props.theme.borderRadii.sm, componentStyles);
+})(["display:flex;flex-wrap:nowrap;overflow:auto;overflow-x:hidden;box-sizing:border-box;direction:", ";", " ", " && a{border-radius:", ";text-decoration:underline;}", ";"], props => props.theme.rtl ? 'rtl' : 'ltr', sizeStyles$3, colorStyles$4, props => props.theme.borderRadii.sm, componentStyles);
 
 export { StyledGlobalAlert };

package/dist/esm/styled/global-alert/StyledGlobalAlertButton.js

@@ -7,17 +7,17 @@
 import styled, { css } from 'styled-components';
 import { componentStyles, getColor, focusStyles } from '@zendeskgarden/react-theming';
 import { Button } from '@zendeskgarden/react-buttons';
-import { colorStyles as colorStyles$1 } from './StyledGlobalAlertClose.js';
+import { colorStyles } from './StyledGlobalAlertClose.js';
 
-const COMPONENT_ID = 'notifications.global_alert.button';
-function colorStyles(props) {
+const COMPONENT_ID$3 = 'notifications.global_alert.button';
+function colorStyles$2(props) {
   const {
     $alertType,
     isBasic,
     theme
   } = props;
   if (isBasic) {
-    return colorStyles$1(props);
+    return colorStyles(props);
   }
   let bgVariable;
   let offsetOptions;
@@ -99,17 +99,17 @@ function colorStyles(props) {
     }
   }), activeBackgroundColor);
 }
-function sizeStyles(props) {
+function sizeStyles$1(props) {
   const marginVertical = `-${props.theme.space.base * 1.5}px`;
   const marginStart = `${props.theme.space.base * 2}px`;
   return css(["margin:", " ", " ", " ", ";"], marginVertical, props.theme.rtl ? marginStart : 0, marginVertical, props.theme.rtl ? 0 : marginStart);
 }
 const StyledGlobalAlertButton = styled(Button).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$3,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertButton",
   componentId: "sc-1txe91a-0"
-})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles, componentStyles);
+})(["flex-shrink:0;", ";", ";", ";"], sizeStyles$1, colorStyles$2, componentStyles);
 
 export { StyledGlobalAlertButton };

package/dist/esm/styled/global-alert/StyledGlobalAlertClose.js

@@ -8,8 +8,8 @@ import styled, { css } from 'styled-components';
 import { componentStyles, getColor, focusStyles } from '@zendeskgarden/react-theming';
 import { IconButton } from '@zendeskgarden/react-buttons';
 
-const COMPONENT_ID = 'notifications.global_alert.close';
-const colorStyles = props => {
+const COMPONENT_ID$4 = 'notifications.global_alert.close';
+const colorStyles$3 = props => {
   const {
     $alertType,
     theme
@@ -83,18 +83,18 @@ const colorStyles = props => {
     }
   }), activeBackgroundColor, activeForegroundColor);
 };
-const sizeStyles = props => {
+const sizeStyles$2 = props => {
   const marginVertical = `-${props.theme.space.base * 1.5}px`;
   const marginStart = `${props.theme.space.base * 2}px`;
   const marginEnd = `-${props.theme.space.base * 2}px`;
   return css(["margin:", " ", " ", " ", ";"], marginVertical, props.theme.rtl ? marginStart : marginEnd, marginVertical, props.theme.rtl ? marginEnd : marginStart);
 };
 const StyledGlobalAlertClose = styled(IconButton).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$4,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertClose",
   componentId: "sc-1g5s93s-0"
-})(["", ";", ";", ";"], sizeStyles, colorStyles, componentStyles);
+})(["", ";", ";", ";"], sizeStyles$2, colorStyles$3, componentStyles);
 
-export { StyledGlobalAlertClose, colorStyles };
+export { StyledGlobalAlertClose, colorStyles$3 as colorStyles };

package/dist/esm/styled/global-alert/StyledGlobalAlertContent.js

@@ -7,10 +7,10 @@
 import styled from 'styled-components';
 import { componentStyles } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'notifications.global_alert.content';
+const COMPONENT_ID$2 = 'notifications.global_alert.content';
 const StyledGlobalAlertContent = styled.div.attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$2,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertContent",
   componentId: "sc-rept0u-0"

package/dist/esm/styled/global-alert/StyledGlobalAlertIcon.js

@@ -8,18 +8,17 @@ import styled, { css } from 'styled-components';
 import { math } from 'polished';
 import { StyledBaseIcon, componentStyles, getColor } from '@zendeskgarden/react-theming';
 
-const COMPONENT_ID = 'notifications.global_alert.icon';
+const COMPONENT_ID$1 = 'notifications.global_alert.icon';
 const sizeStyles = props => {
   const size = props.theme.iconSizes.md;
   const marginTop = math(`(${props.theme.space.base * 5} - ${size}) / 2`);
   const marginHorizontal = `${props.theme.space.base * 2}px`;
   return css(["margin-top:", ";margin-", ":", ";width:", ";height:", ";"], marginTop, props.theme.rtl ? 'left' : 'right', marginHorizontal, size, size);
 };
-const colorStyles = _ref => {
-  let {
-    theme,
-    $alertType
-  } = _ref;
+const colorStyles$1 = ({
+  theme,
+  $alertType
+}) => {
   let color;
   switch ($alertType) {
     case 'success':
@@ -52,11 +51,11 @@ const colorStyles = _ref => {
   return css(["color:", ";"], color);
 };
 const StyledGlobalAlertIcon = styled(StyledBaseIcon).attrs({
-  'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-id': COMPONENT_ID$1,
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertIcon",
   componentId: "sc-84ne9k-0"
-})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles, componentStyles);
+})(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles$1, componentStyles);
 
 export { StyledGlobalAlertIcon };

package/dist/esm/styled/global-alert/StyledGlobalAlertTitle.js

@@ -8,11 +8,10 @@ import styled, { css } from 'styled-components';
 import { componentStyles, getColor } from '@zendeskgarden/react-theming';
 
 const COMPONENT_ID = 'notifications.global_alert.title';
-const colorStyles = _ref => {
-  let {
-    theme,
-    $alertType
-  } = _ref;
+const colorStyles = ({
+  theme,
+  $alertType
+}) => {
   let color;
   switch ($alertType) {
     case 'success':
@@ -37,7 +36,7 @@ const colorStyles = _ref => {
 };
 const StyledGlobalAlertTitle = styled.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertTitle",
   componentId: "sc-10clqbo-0"

package/dist/index.cjs.js

@@ -158,11 +158,10 @@ const validationTypes = {
 };
 
 const COMPONENT_ID$d = 'notifications.close';
-const colorStyles$a = _ref => {
-  let {
-    theme,
-    $type
-  } = _ref;
+const colorStyles$a = ({
+  theme,
+  $type
+}) => {
   let variable;
   switch ($type) {
     case validationTypes.warning:
@@ -206,7 +205,7 @@ const colorStyles$a = _ref => {
 };
 const StyledClose = styled__default.default(reactButtons.IconButton).attrs({
   'data-garden-id': COMPONENT_ID$d,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledClose",
   componentId: "sc-1mr9nx1-0"
@@ -215,7 +214,7 @@ const StyledClose = styled__default.default(reactButtons.IconButton).attrs({
 const COMPONENT_ID$c = 'notifications.paragraph';
 const StyledParagraph = styled__default.default.p.attrs({
   'data-garden-id': COMPONENT_ID$c,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledParagraph",
   componentId: "sc-12tmd6p-0"
@@ -224,7 +223,7 @@ const StyledParagraph = styled__default.default.p.attrs({
 const COMPONENT_ID$b = 'notifications.title';
 const StyledTitle = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$b,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledTitle",
   componentId: "sc-xx4jsv-0"
@@ -234,12 +233,11 @@ const StyledTitle = styled__default.default.div.attrs({
 }), props => props.$isRegular ? props.theme.fontWeights.regular : props.theme.fontWeights.semibold, reactTheming.componentStyles);
 
 const COMPONENT_ID$a = 'notifications.base_container';
-const colorStyles$9 = _ref => {
-  let {
-    theme,
-    $type,
-    $isFloating
-  } = _ref;
+const colorStyles$9 = ({
+  theme,
+  $type,
+  $isFloating
+}) => {
   const {
     space,
     shadows
@@ -305,7 +303,7 @@ const padding = props => {
 };
 const StyledBase = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$a,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledBase",
   componentId: "sc-14syaqw-0"
@@ -340,7 +338,7 @@ const colorStyles$8 = props => {
 };
 const StyledAlert = styled__default.default(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$9,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledAlert",
   componentId: "sc-fyn8jp-0"
@@ -375,7 +373,7 @@ const colorStyles$7 = props => {
 };
 const StyledNotification = styled__default.default(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$8,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledNotification",
   componentId: "sc-uf6jh-0"
@@ -385,12 +383,11 @@ StyledNotification.propTypes = {
 };
 
 const COMPONENT_ID$7 = 'notifications.well';
-const colorStyles$6 = _ref => {
-  let {
-    theme,
-    $isFloating,
-    $isRecessed
-  } = _ref;
+const colorStyles$6 = ({
+  theme,
+  $isFloating,
+  $isRecessed
+}) => {
   let backgroundVariable;
   if ($isRecessed) {
     backgroundVariable = 'background.recessed';
@@ -411,27 +408,25 @@ const colorStyles$6 = _ref => {
 };
 const StyledWell = styled__default.default(StyledBase).attrs({
   'data-garden-id': COMPONENT_ID$7,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledWell",
   componentId: "sc-a5831c-0"
 })(["", " ", ";"], colorStyles$6, reactTheming.componentStyles);
 
 const COMPONENT_ID$6 = 'notifications.icon';
-const sizeStyles$4 = _ref => {
-  let {
-    theme: {
-      rtl,
-      space
-    }
-  } = _ref;
+const sizeStyles$4 = ({
+  theme: {
+    rtl,
+    space
+  }
+}) => {
   return styled.css(["right:", ";left:", ";margin-top:", "px;"], rtl && `${space.base * 4}px`, !rtl && `${space.base * 4}px`, space.base / 2);
 };
-const colorStyles$5 = _ref2 => {
-  let {
-    theme,
-    $type
-  } = _ref2;
+const colorStyles$5 = ({
+  theme,
+  $type
+}) => {
   let variable;
   switch ($type) {
     case validationTypes.success:
@@ -458,18 +453,17 @@ const colorStyles$5 = _ref2 => {
 };
 const StyledIcon = styled__default.default(reactTheming.StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID$6,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledIcon",
   componentId: "sc-msklws-0"
 })(["position:absolute;", " ", " ", ""], sizeStyles$4, colorStyles$5, reactTheming.componentStyles);
 
 const COMPONENT_ID$5 = 'notifications.global_alert';
-const colorStyles$4 = _ref => {
-  let {
-    theme,
-    $alertType
-  } = _ref;
+const colorStyles$4 = ({
+  theme,
+  $alertType
+}) => {
   let borderColor;
   let backgroundColor;
   let foregroundColor;
@@ -605,7 +599,7 @@ const sizeStyles$3 = props => {
 };
 const StyledGlobalAlert = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$5,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlert",
   componentId: "sc-k6rimt-0"
@@ -694,7 +688,7 @@ const sizeStyles$2 = props => {
 };
 const StyledGlobalAlertClose = styled__default.default(reactButtons.IconButton).attrs({
   'data-garden-id': COMPONENT_ID$4,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertClose",
   componentId: "sc-1g5s93s-0"
@@ -797,7 +791,7 @@ function sizeStyles$1(props) {
 }
 const StyledGlobalAlertButton = styled__default.default(reactButtons.Button).attrs({
   'data-garden-id': COMPONENT_ID$3,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertButton",
   componentId: "sc-1txe91a-0"
@@ -806,7 +800,7 @@ const StyledGlobalAlertButton = styled__default.default(reactButtons.Button).att
 const COMPONENT_ID$2 = 'notifications.global_alert.content';
 const StyledGlobalAlertContent = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID$2,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertContent",
   componentId: "sc-rept0u-0"
@@ -819,11 +813,10 @@ const sizeStyles = props => {
   const marginHorizontal = `${props.theme.space.base * 2}px`;
   return styled.css(["margin-top:", ";margin-", ":", ";width:", ";height:", ";"], marginTop, props.theme.rtl ? 'left' : 'right', marginHorizontal, size, size);
 };
-const colorStyles$1 = _ref => {
-  let {
-    theme,
-    $alertType
-  } = _ref;
+const colorStyles$1 = ({
+  theme,
+  $alertType
+}) => {
   let color;
   switch ($alertType) {
     case 'success':
@@ -857,18 +850,17 @@ const colorStyles$1 = _ref => {
 };
 const StyledGlobalAlertIcon = styled__default.default(reactTheming.StyledBaseIcon).attrs({
   'data-garden-id': COMPONENT_ID$1,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertIcon",
   componentId: "sc-84ne9k-0"
 })(["flex-shrink:0;", ";", ";", ";"], sizeStyles, colorStyles$1, reactTheming.componentStyles);
 
 const COMPONENT_ID = 'notifications.global_alert.title';
-const colorStyles = _ref => {
-  let {
-    theme,
-    $alertType
-  } = _ref;
+const colorStyles = ({
+  theme,
+  $alertType
+}) => {
   let color;
   switch ($alertType) {
     case 'success':
@@ -893,7 +885,7 @@ const colorStyles = _ref => {
 };
 const StyledGlobalAlertTitle = styled__default.default.div.attrs({
   'data-garden-id': COMPONENT_ID,
-  'data-garden-version': '9.12.3'
+  'data-garden-version': '9.12.4'
 }).withConfig({
   displayName: "StyledGlobalAlertTitle",
   componentId: "sc-10clqbo-0"
@@ -904,16 +896,13 @@ const useNotificationsContext = () => {
   return React.useContext(NotificationsContext);
 };
 
-const Title$1 = React__namespace.default.forwardRef((_ref, ref) => {
-  let {
-    isRegular,
-    ...props
-  } = _ref;
-  return React__namespace.default.createElement(StyledTitle, Object.assign({
-    ref: ref,
-    $isRegular: isRegular
-  }, props));
-});
+const Title$1 = React__namespace.default.forwardRef(({
+  isRegular,
+  ...props
+}, ref) => React__namespace.default.createElement(StyledTitle, Object.assign({
+  ref: ref,
+  $isRegular: isRegular
+}, props)));
 Title$1.displayName = 'Alert.Title';
 
 const Paragraph$1 = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledParagraph, Object.assign({
@@ -952,12 +941,11 @@ const Close$1 = React__namespace.default.forwardRef((props, ref) => {
 });
 Close$1.displayName = 'Alert.Close';
 
-const AlertComponent = React__namespace.default.forwardRef((_ref, ref) => {
-  let {
-    role,
-    type,
-    ...props
-  } = _ref;
+const AlertComponent = React__namespace.default.forwardRef(({
+  role,
+  type,
+  ...props
+}, ref) => {
   const Icon = validationIcons[type];
   return React__namespace.default.createElement(NotificationsContext.Provider, {
     value: type
@@ -978,16 +966,13 @@ Alert.Close = Close$1;
 Alert.Paragraph = Paragraph$1;
 Alert.Title = Title$1;
 
-const Title = React__namespace.default.forwardRef((_ref, ref) => {
-  let {
-    isRegular,
-    ...props
-  } = _ref;
-  return React__namespace.default.createElement(StyledTitle, Object.assign({
-    ref: ref,
-    $isRegular: isRegular
-  }, props));
-});
+const Title = React__namespace.default.forwardRef(({
+  isRegular,
+  ...props
+}, ref) => React__namespace.default.createElement(StyledTitle, Object.assign({
+  ref: ref,
+  $isRegular: isRegular
+}, props)));
 Title.displayName = 'Notification.Title';
 
 const Paragraph = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledParagraph, Object.assign({
@@ -1009,12 +994,11 @@ const Close = React__namespace.default.forwardRef((props, ref) => {
 });
 Close.displayName = 'Notification.Close';
 
-const NotificationComponent = React.forwardRef((_ref, ref) => {
-  let {
-    children,
-    type,
-    ...props
-  } = _ref;
+const NotificationComponent = React.forwardRef(({
+  children,
+  type,
+  ...props
+}, ref) => {
   const Icon = type ? validationIcons[type] : SvgInfoStroke;
   return React__namespace.default.createElement(StyledNotification, Object.assign({
     ref: ref,
@@ -1034,18 +1018,15 @@ Notification.Close = Close;
 Notification.Paragraph = Paragraph;
 Notification.Title = Title;
 
-const WellComponent = React__namespace.default.forwardRef((_ref, ref) => {
-  let {
-    isFloating,
-    isRecessed,
-    ...props
-  } = _ref;
-  return React__namespace.default.createElement(StyledWell, Object.assign({
-    ref: ref,
-    $isFloating: isFloating,
-    $isRecessed: isRecessed
-  }, props));
-});
+const WellComponent = React__namespace.default.forwardRef(({
+  isFloating,
+  isRecessed,
+  ...props
+}, ref) => React__namespace.default.createElement(StyledWell, Object.assign({
+  ref: ref,
+  $isFloating: isFloating,
+  $isRecessed: isRecessed
+}, props)));
 WellComponent.displayName = 'Well';
 WellComponent.propTypes = {
   isRecessed: PropTypes__default.default.bool,
@@ -1129,8 +1110,7 @@ const useToast = () => {
     dispatch,
     state
   } = context;
-  const addToast = React.useCallback(function (content) {
-    let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  const addToast = React.useCallback((content, options = {}) => {
     const mergedOptions = {
       ...DEFAULT_TOAST_OPTIONS,
       ...options
@@ -1175,11 +1155,10 @@ const useToast = () => {
   };
 };
 
-const Toast = _ref => {
-  let {
-    toast,
-    pauseTimers
-  } = _ref;
+const Toast = ({
+  toast,
+  pauseTimers
+}) => {
   const {
     removeToast
   } = useToast();
@@ -1281,14 +1260,13 @@ const StyledTransitionContainer = styled__default.default.div.withConfig({
   componentId: "sc-nq0usb-1"
 })(["position:fixed;z-index:", ";", ";"], props => props.$toastZIndex, placementStyles);
 
-const ToastSlot = _ref => {
-  let {
-    toasts,
-    placement,
-    zIndex,
-    limit,
-    ...props
-  } = _ref;
+const ToastSlot = ({
+  toasts,
+  placement,
+  zIndex,
+  limit,
+  ...props
+}) => {
   const [pauseTimers, setPauseTimers] = React.useState(false);
   const theme = React.useContext(styled.ThemeContext);
   const environment = reactTheming.useDocument(theme);
@@ -1349,13 +1327,12 @@ const ToastSlot = _ref => {
   })));
 };
 
-const ToastProvider = _ref => {
-  let {
-    limit = 4,
-    zIndex,
-    placementProps = {},
-    children
-  } = _ref;
+const ToastProvider = ({
+  limit = 4,
+  zIndex,
+  placementProps = {},
+  children
+}) => {
   const [state, dispatch] = React.useReducer(toasterReducer, getInitialState());
   const contextValue = React.useMemo(() => ({
     state,
@@ -1389,11 +1366,10 @@ const GlobalAlertContext = React.createContext({
 });
 const useGlobalAlertContext = () => React.useContext(GlobalAlertContext);
 
-const GlobalAlertButton = React.forwardRef((_ref, ref) => {
-  let {
-    isBasic,
-    ...props
-  } = _ref;
+const GlobalAlertButton = React.forwardRef(({
+  isBasic,
+  ...props
+}, ref) => {
   const {
     type
   } = useGlobalAlertContext();
@@ -1435,11 +1411,10 @@ const GlobalAlertContent = React.forwardRef((props, ref) => {
 });
 GlobalAlertContent.displayName = 'GlobalAlert.Content';
 
-const GlobalAlertTitle = React.forwardRef((_ref, ref) => {
-  let {
-    isRegular,
-    ...props
-  } = _ref;
+const GlobalAlertTitle = React.forwardRef(({
+  isRegular,
+  ...props
+}, ref) => {
   const {
     type
   } = useGlobalAlertContext();
@@ -1454,11 +1429,10 @@ GlobalAlertTitle.propTypes = {
   isRegular: PropTypes__default.default.bool
 };
 
-const GlobalAlertComponent = React.forwardRef((_ref, ref) => {
-  let {
-    type,
-    ...props
-  } = _ref;
+const GlobalAlertComponent = React.forwardRef(({
+  type,
+  ...props
+}, ref) => {
   const icon = {
     success: React__namespace.default.createElement(SvgCheckCircleStroke, null),
     error: React__namespace.default.createElement(SvgAlertErrorStroke, null),