@elliemae/ds-modal 2.0.0-next.0 → 2.0.0-next.13

package/esm/v1/DSModal.js

@@ -1,54 +1,60 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import 'react';
 import ReactModal from 'react-modal';
 import { convertPropToCssClassName } from '@elliemae/ds-classnames';
-import CloseIcon from '@elliemae/ds-icons/Close';
-import { DSIconSizes } from '@elliemae/ds-basic/Icon';
-import DSButton from '@elliemae/ds-basic/Button';
+import { DSIconSizes } from '@elliemae/ds-icon';
+import { Close } from '@elliemae/ds-icons';
+import DSButton from '@elliemae/ds-button';
 import { MODAL_TYPE } from '../constants.js';
 import ModalFeedBack from './ModalFeedBack/ModalFeedBack.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var _CloseIcon;
+var _Close;
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const DSModal = ({
-  containerProps = {},
-  className = '',
-  dataTestId = 'ds-modal',
-  additionalFooterCssClass = '',
-  style = {},
-  iconCloseSize = DSIconSizes.S,
-  modalType = MODAL_TYPE.DEFAULT,
-  showHeader = true,
-  showFooter = true,
-  children,
-  centered = true,
-  confirmLabel = 'Accept',
-  modalTitle = '',
-  size = 'medium',
-  isOpen = false,
-  onClose = () => null,
-  onAfterOpen = () => null,
-  onConfirm = () => null,
-  onReject = () => null,
-  rejectLabel = 'Cancel',
-  shouldCloseOnOverlayClick = false,
-  hasError = false,
-  hasWarning = false,
-  hasSuccess = false,
-  hasInfo = false,
-  hasHelp = false,
-  actionsRef = () => null,
-  appElement = '#root',
-  overridePropsConfirmButton = {},
-  overridePropsRejectButton = {},
-  zIndex = 10
-}) => {
+const DSModal = _ref => {
+  let {
+    containerProps = {},
+    className = '',
+    dataTestId = 'ds-modal',
+    additionalFooterCssClass = '',
+    style = {},
+    iconCloseSize = DSIconSizes.S,
+    modalType = MODAL_TYPE.DEFAULT,
+    showHeader = true,
+    showFooter = true,
+    children,
+    centered = true,
+    confirmLabel = 'Accept',
+    modalTitle = '',
+    size = 'medium',
+    isOpen = false,
+    onClose = () => null,
+    onAfterOpen = () => null,
+    onConfirm = () => null,
+    onReject = () => null,
+    rejectLabel = 'Cancel',
+    shouldCloseOnOverlayClick = false,
+    hasError = false,
+    hasWarning = false,
+    hasSuccess = false,
+    hasInfo = false,
+    hasHelp = false,
+    actionsRef = () => null,
+    appElement = '#root',
+    overridePropsConfirmButton = {},
+    overridePropsRejectButton = {},
+    zIndex = 10
+  } = _ref;
   // http://reactcommunity.org/react-modal/accessibility/ https://github.com/reactjs/react-modal#examples
   typeof document !== 'undefined' && document && ReactModal.setAppElement && ReactModal.setAppElement(appElement); // eslint-disable-line
 
@@ -81,7 +87,7 @@ const DSModal = ({
     isOpen: isOpen,
     onAfterOpen: onAfterOpen,
     onRequestClose: onClose,
-    overlayClassName: `${classNameBlock('overlay')} ${classNameModifier(centered && 'center')}`,
+    overlayClassName: "".concat(classNameBlock('overlay'), " ").concat(classNameModifier(centered && 'center')),
     shouldCloseOnOverlayClick: shouldCloseOnOverlayClick,
     style: {
       content: _objectSpread({}, style),
@@ -98,7 +104,7 @@ const DSModal = ({
       className: classNameElement('icon', 'modal-header')
     }, void 0, /*#__PURE__*/_jsx(DSButton, {
       buttonType: "link",
-      icon: _CloseIcon || (_CloseIcon = /*#__PURE__*/_jsx(CloseIcon, {})),
+      icon: _Close || (_Close = /*#__PURE__*/_jsx(Close, {})),
       onClick: onClose,
       size: iconCloseSize
     }))), /*#__PURE__*/_jsx("div", {
@@ -111,18 +117,18 @@ const DSModal = ({
       hasWarning: hasWarning,
       modalType: modalType
     }), children), showFooter && !isAFeedbackType && /*#__PURE__*/_jsx("div", {
-      className: `${classNameBlock('modal-footer')} ${additionalFooterCssClass ? classNameBlockModifier(additionalFooterCssClass, 'modal-footer') : ''}`
+      className: "".concat(classNameBlock('modal-footer'), " ").concat(additionalFooterCssClass ? classNameBlockModifier(additionalFooterCssClass, 'modal-footer') : '')
     }, void 0, /*#__PURE__*/jsxs("div", {
       ref: actionsRef,
       className: classNameBlock('modal-footer-actions'),
       children: [modalType === MODAL_TYPE.CONFIRM && /*#__PURE__*/jsx(DSButton, _objectSpread({
         buttonType: "secondary",
-        className: `${classNameElement('button-action')} ${classNameModifier('reject', 'button-action')} `,
+        className: "".concat(classNameElement('button-action'), " ").concat(classNameModifier('reject', 'button-action'), " "),
         labelText: rejectLabel,
         onClick: onReject
       }, overridePropsRejectButton)), /*#__PURE__*/jsx(DSButton, _objectSpread({
         buttonType: "primary",
-        className: `${classNameElement('button-action')} ${classNameModifier('confirm', 'button-action')} `,
+        className: "".concat(classNameElement('button-action'), " ").concat(classNameModifier('confirm', 'button-action'), " "),
         labelText: confirmLabel,
         onClick: onConfirm
       }, overridePropsConfirmButton))]

package/esm/v1/DSModalWrapper.js

@@ -1,4 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import { Component, createElement } from 'react';
 import { MODAL_TYPE } from '../constants.js';
 
@@ -7,8 +13,8 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 var DSModalWrapper = (WrappedComponent => {
   class DSModalWrapper extends Component {
-    constructor(...args) {
-      super(...args);
+    constructor() {
+      super(...arguments);
 
       _defineProperty(this, "state", {
         childready: false,
@@ -28,9 +34,11 @@ var DSModalWrapper = (WrappedComponent => {
         this.heightFooter = e.height || 0;
       });
 
-      _defineProperty(this, "onResize", ({
-        bounds
-      }) => {
+      _defineProperty(this, "onResize", _ref => {
+        let {
+          bounds
+        } = _ref;
+
         if (this.heightFooterFlag && this.heightHeaderFlag) {
           return this.setState({
             height: bounds.height - this.heightFooter - this.heightHeader

package/esm/v1/ModalFeedBack/ModalFeedBack.js

@@ -1,9 +1,6 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import WarningCircle from '@elliemae/ds-icons/WarningCircle';
-import CheckmarkCircle from '@elliemae/ds-icons/CheckmarkCircle';
-import HelpCircle from '@elliemae/ds-icons/HelpCircle';
-import InfoCircle from '@elliemae/ds-icons/InfoCircle';
+import { InfoCircle, HelpCircle, CheckmarkCircle, WarningCircle } from '@elliemae/ds-icons';
 import { convertPropToCssClassName } from '@elliemae/ds-classnames';
 import { MODAL_TYPE } from '../../constants.js';
 
@@ -17,13 +14,14 @@ const {
   INFO
 } = MODAL_TYPE;
 
-const getModalType = (modalType, {
-  hasError,
-  hasWarning,
-  hasSuccess,
-  hasInfo,
-  hasHelp
-}) => {
+const getModalType = (modalType, _ref) => {
+  let {
+    hasError,
+    hasWarning,
+    hasSuccess,
+    hasInfo,
+    hasHelp
+  } = _ref;
   if ([WARNING, ERROR, SUCCESS, HELP, INFO].indexOf(modalType) > -1) return modalType;
   if (hasError) return ERROR;
   if (hasWarning) return WARNING;
@@ -63,15 +61,16 @@ const getIconType = modalType => {
   }
 };
 
-const ModalFeedBack = ({
-  className = '',
-  modalType = null,
-  hasError = false,
-  hasWarning = false,
-  hasSuccess = false,
-  hasInfo = false,
-  hasHelp = false
-}) => {
+const ModalFeedBack = _ref2 => {
+  let {
+    className = '',
+    modalType = null,
+    hasError = false,
+    hasWarning = false,
+    hasSuccess = false,
+    hasInfo = false,
+    hasHelp = false
+  } = _ref2;
   const type = getModalType(modalType, {
     hasError,
     hasWarning,

package/esm/v2/DSModal.js

@@ -1,3 +1,8 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import 'react';
@@ -12,39 +17,41 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const DSModal = ({
-  containerProps = {},
-  className = '',
-  style = {},
-  size = 'default',
-  //
-  modalType = MODAL_TYPE_V2.INFORMATION,
-  modalSubType = null,
-  modalTitle = '',
-  dataTestId = 'ds-modal',
-  centered = false,
-  showRejectButton = false,
-  showClose = true,
-  searchProps = {},
-  // override
-  actionsRef = () => null,
-  additionalFooterCssClass,
-  overridePropsConfirmButton = {},
-  overridePropsRejectButton = {},
-  // react modal
-  children,
-  isOpen = true,
-  onClose = () => null,
-  onAfterOpen = () => null,
-  onConfirm = () => null,
-  onReject = () => null,
-  rejectLabel = 'Discard',
-  confirmLabel = 'Save',
-  shouldCloseOnOverlayClick = false,
-  appElement = '#root',
-  zIndex = 10,
-  removePadding = false
-}) => {
+const DSModal = _ref => {
+  let {
+    containerProps = {},
+    className = '',
+    style = {},
+    size = 'default',
+    //
+    modalType = MODAL_TYPE_V2.INFORMATION,
+    modalSubType = null,
+    modalTitle = '',
+    dataTestId = 'ds-modal',
+    centered = false,
+    showRejectButton = false,
+    showClose = true,
+    searchProps = {},
+    // override
+    actionsRef = () => null,
+    additionalFooterCssClass,
+    overridePropsConfirmButton = {},
+    overridePropsRejectButton = {},
+    // react modal
+    children,
+    isOpen = true,
+    onClose = () => null,
+    onAfterOpen = () => null,
+    onConfirm = () => null,
+    onReject = () => null,
+    rejectLabel = 'Discard',
+    confirmLabel = 'Save',
+    shouldCloseOnOverlayClick = false,
+    appElement = '#root',
+    zIndex = 10,
+    removePadding = false
+  } = _ref;
+
   if (typeof document !== 'undefined' && process.env.NODE_ENV !== 'test' && document && ReactModal.setAppElement) {
     ReactModal.setAppElement(appElement);
   }
@@ -58,12 +65,12 @@ const DSModal = ({
   });
   return /*#__PURE__*/_jsx(ReactModal, {
     testId: dataTestId,
-    className: `${cssClassName} ${classNameBlock(`type-${modalType}`)}`,
+    className: "".concat(cssClassName, " ").concat(classNameBlock("type-".concat(modalType))),
     contentLabel: modalTitle,
     isOpen: isOpen,
     onAfterOpen: onAfterOpen,
     onRequestClose: onClose,
-    overlayClassName: `${classNameBlock('overlay')} ${classNameModifier(centered ? 'center' : 'top')}`,
+    overlayClassName: "".concat(classNameBlock('overlay'), " ").concat(classNameModifier(centered ? 'center' : 'top')),
     shouldCloseOnOverlayClick: shouldCloseOnOverlayClick,
     style: {
       content: _objectSpread({}, style),

package/esm/v2/blocks.js

@@ -1,53 +1,77 @@
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 
 const blockName = 'modal-v2';
-const ModalHeader = aggregatedClasses('div')(blockName, 'modal-header', ({
-  type,
-  showClose
-}) => ({
-  [type]: type,
-  'with-close': showClose
-}));
-const ModalHeaderTopRight = aggregatedClasses('div')(blockName, 'modal-header-close', ({
-  type
-}) => ({
-  [type]: type
-}));
-const ModalFeedback = aggregatedClasses('div')(blockName, 'modal-feedback', ({
-  type
-}) => ({
-  [type]: type
-}));
-const ModalTitle = aggregatedClasses('h3')(blockName, 'modal-title', ({
-  type
-}) => ({
-  [type]: type
-}));
-const ModalContent = aggregatedClasses('div')(blockName, 'modal-content', ({
-  type,
-  removePadding
-}) => ({
-  [type]: type,
-  'remove-padding': removePadding
-}));
-const ModalWrapper = aggregatedClasses('div')(blockName, 'modal-wrapper', ({
-  type,
-  removePadding
-}) => ({
-  [type]: type,
-  'remove-padding': removePadding
-}));
-const ModalFooter = aggregatedClasses('div')(blockName, 'modal-footer', ({
-  type,
-  additionalFooterCssClass
-}) => ({
-  [type]: type,
-  [additionalFooterCssClass]: additionalFooterCssClass
-}));
-const ModalFooterActions = aggregatedClasses('div')(blockName, 'modal-footer-actions', ({
-  type
-}) => ({
-  [type]: type
-}));
+const ModalHeader = aggregatedClasses('div')(blockName, 'modal-header', _ref => {
+  let {
+    type,
+    showClose
+  } = _ref;
+  return {
+    [type]: type,
+    'with-close': showClose
+  };
+});
+const ModalHeaderTopRight = aggregatedClasses('div')(blockName, 'modal-header-close', _ref2 => {
+  let {
+    type
+  } = _ref2;
+  return {
+    [type]: type
+  };
+});
+const ModalFeedback = aggregatedClasses('div')(blockName, 'modal-feedback', _ref3 => {
+  let {
+    type
+  } = _ref3;
+  return {
+    [type]: type
+  };
+});
+const ModalTitle = aggregatedClasses('h3')(blockName, 'modal-title', _ref4 => {
+  let {
+    type
+  } = _ref4;
+  return {
+    [type]: type
+  };
+});
+const ModalContent = aggregatedClasses('div')(blockName, 'modal-content', _ref5 => {
+  let {
+    type,
+    removePadding
+  } = _ref5;
+  return {
+    [type]: type,
+    'remove-padding': removePadding
+  };
+});
+const ModalWrapper = aggregatedClasses('div')(blockName, 'modal-wrapper', _ref6 => {
+  let {
+    type,
+    removePadding
+  } = _ref6;
+  return {
+    [type]: type,
+    'remove-padding': removePadding
+  };
+});
+const ModalFooter = aggregatedClasses('div')(blockName, 'modal-footer', _ref7 => {
+  let {
+    type,
+    additionalFooterCssClass
+  } = _ref7;
+  return {
+    [type]: type,
+    [additionalFooterCssClass]: additionalFooterCssClass
+  };
+});
+const ModalFooterActions = aggregatedClasses('div')(blockName, 'modal-footer-actions', _ref8 => {
+  let {
+    type
+  } = _ref8;
+  return {
+    [type]: type
+  };
+});
 
 export { ModalContent, ModalFeedback, ModalFooter, ModalFooterActions, ModalHeader, ModalHeaderTopRight, ModalTitle, ModalWrapper };

package/esm/v2/components/DecisionHeader.js

@@ -1,25 +1,28 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import CloseIcon from '@elliemae/ds-icons/Close';
-import DSButton from '@elliemae/ds-basic/Button';
+import { Close } from '@elliemae/ds-icons';
+import DSButton from '@elliemae/ds-button';
 import { ModalHeader } from '../blocks.js';
 
-var _CloseIcon;
-const DecisionHeader = ({
-  onClose,
-  showClose
-}) => /*#__PURE__*/_jsx(ModalHeader, {
-  classProps: {
-    type: 'decision',
+var _Close;
+const DecisionHeader = _ref => {
+  let {
+    onClose,
     showClose
-  }
-}, void 0, showClose && /*#__PURE__*/_jsx(DSButton, {
-  buttonType: "link",
-  containerProps: {
-    'data-testid': 'modal-button-close'
-  },
-  icon: _CloseIcon || (_CloseIcon = /*#__PURE__*/_jsx(CloseIcon, {})),
-  onClick: onClose
-}));
+  } = _ref;
+  return /*#__PURE__*/_jsx(ModalHeader, {
+    classProps: {
+      type: 'decision',
+      showClose
+    }
+  }, void 0, showClose && /*#__PURE__*/_jsx(DSButton, {
+    buttonType: "link",
+    containerProps: {
+      'data-testid': 'modal-button-close'
+    },
+    icon: _Close || (_Close = /*#__PURE__*/_jsx(Close, {})),
+    onClick: onClose
+  }));
+};
 
 export { DecisionHeader, DecisionHeader as default };

package/esm/v2/components/FeedbackIcon.js

@@ -1,10 +1,6 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import ErrorHexegon from '@elliemae/ds-icons/ErrorHexegon';
-import WarningTriangle from '@elliemae/ds-icons/WarningTriangle';
-import CheckmarkCircle from '@elliemae/ds-icons/CheckmarkCircle';
-import HelpCircle from '@elliemae/ds-icons/HelpCircle';
-import InfoCircle from '@elliemae/ds-icons/InfoCircle';
+import { HelpCircle, InfoCircle, CheckmarkCircle, ErrorHexegon, WarningTriangle } from '@elliemae/ds-icons';
 import { MODAL_SUB_TYPE_V2 } from '../../constants.js';
 import { ModalFeedback } from '../blocks.js';
 
@@ -45,12 +41,15 @@ const getIconType = subtype => {
   }
 };
 
-const FeedbackIcon = ({
-  modalSubType
-}) => /*#__PURE__*/_jsx(ModalFeedback, {
-  classProps: {
-    type: modalSubType
-  }
-}, void 0, getIconType(modalSubType));
+const FeedbackIcon = _ref => {
+  let {
+    modalSubType
+  } = _ref;
+  return /*#__PURE__*/_jsx(ModalFeedback, {
+    classProps: {
+      type: modalSubType
+    }
+  }, void 0, getIconType(modalSubType));
+};
 
 export { FeedbackIcon, FeedbackIcon as default };

package/esm/v2/components/Footer.js

@@ -1,47 +1,55 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import 'react';
-import DSButton from '@elliemae/ds-basic/Button';
+import DSButton from '@elliemae/ds-button';
 import { ModalFooter, ModalFooterActions } from '../blocks.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-const Footer = ({
-  additionalFooterCssClass,
-  actionsRef,
-  rejectLabel,
-  onReject,
-  overridePropsRejectButton,
-  confirmLabel,
-  onConfirm,
-  overridePropsConfirmButton,
-  showRejectButton
-}) => /*#__PURE__*/_jsx(ModalFooter, {
-  classProps: {
-    additionalFooterCssClass
-  },
-  "data-testid": "modal-footer-wrapper"
-}, void 0, /*#__PURE__*/jsxs(ModalFooterActions, {
-  ref: actionsRef,
-  children: [showRejectButton === true && /*#__PURE__*/jsx(DSButton, _objectSpread({
-    buttonType: "secondary",
-    className: "action-reject",
-    containerProps: {
-      'data-testid': 'modal-footer-reject-btn'
+const Footer = _ref => {
+  let {
+    additionalFooterCssClass,
+    actionsRef,
+    rejectLabel,
+    onReject,
+    overridePropsRejectButton,
+    confirmLabel,
+    onConfirm,
+    overridePropsConfirmButton,
+    showRejectButton
+  } = _ref;
+  return /*#__PURE__*/_jsx(ModalFooter, {
+    classProps: {
+      additionalFooterCssClass
     },
-    labelText: rejectLabel,
-    onClick: onReject
-  }, overridePropsRejectButton)), /*#__PURE__*/jsx(DSButton, _objectSpread({
-    buttonType: "primary",
-    className: "action-confirm",
-    containerProps: {
-      'data-testid': 'modal-footer-confirm-btn'
-    },
-    labelText: confirmLabel,
-    onClick: onConfirm
-  }, overridePropsConfirmButton))]
-}));
+    "data-testid": "modal-footer-wrapper"
+  }, void 0, /*#__PURE__*/jsxs(ModalFooterActions, {
+    ref: actionsRef,
+    children: [showRejectButton === true && /*#__PURE__*/jsx(DSButton, _objectSpread({
+      buttonType: "secondary",
+      className: "action-reject",
+      containerProps: {
+        'data-testid': 'modal-footer-reject-btn'
+      },
+      labelText: rejectLabel,
+      onClick: onReject
+    }, overridePropsRejectButton)), /*#__PURE__*/jsx(DSButton, _objectSpread({
+      buttonType: "primary",
+      className: "action-confirm",
+      containerProps: {
+        'data-testid': 'modal-footer-confirm-btn'
+      },
+      labelText: confirmLabel,
+      onClick: onConfirm
+    }, overridePropsConfirmButton))]
+  }));
+};
 
 export { Footer, Footer as default };