@elliemae/ds-modal 2.2.0-alpha.4 → 3.0.0-next.2

package/cjs/v1/DSModal.js

@@ -1,177 +1,148 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var DSModal_exports = {};
-__export(DSModal_exports, {
-  default: () => DSModal_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_prop_types = __toESM(require("prop-types"));
-var import_react_modal = __toESM(require("react-modal"));
-var import_ds_classnames = require("@elliemae/ds-classnames");
-var import_ds_icon = require("@elliemae/ds-icon");
-var import_ds_icons = require("@elliemae/ds-icons");
-var import_ds_button = __toESM(require("@elliemae/ds-button"));
-var import_constants = __toESM(require("../constants"));
-var import_ModalFeedBack = __toESM(require("./ModalFeedBack/ModalFeedBack"));
-var import_prop_types2 = require("@elliemae/ds-shared/prop-types");
-const DSModal = ({
-  containerProps = {},
-  className = "",
-  dataTestId = "ds-modal",
-  additionalFooterCssClass = "",
-  style = {},
-  iconCloseSize = import_ds_icon.DSIconSizes.S,
-  modalType = import_constants.default.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
-}) => {
-  typeof document !== "undefined" && document && import_react_modal.default.setAppElement && import_react_modal.default.setAppElement(appElement);
-  const { cssClassName, classNameElement, classNameBlock, classNameModifier, classNameBlockModifier } = (0, import_ds_classnames.convertPropToCssClassName)("modal", className, {
+'use strict';
+
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('react');
+var ReactModal = require('react-modal');
+var dsClassnames = require('@elliemae/ds-classnames');
+var dsIcon = require('@elliemae/ds-icon');
+var dsIcons = require('@elliemae/ds-icons');
+var DSButton = require('@elliemae/ds-button');
+var constants = require('../constants.js');
+var ModalFeedBack = require('./ModalFeedBack/ModalFeedBack.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var ReactModal__default = /*#__PURE__*/_interopDefaultLegacy(ReactModal);
+var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
+
+var _Close;
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+const DSModal = _ref => {
+  let {
+    containerProps = {},
+    className = '',
+    dataTestId = 'ds-modal',
+    additionalFooterCssClass = '',
+    style = {},
+    iconCloseSize = dsIcon.DSIconSizes.S,
+    modalType = constants.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__default["default"].setAppElement && ReactModal__default["default"].setAppElement(appElement); // eslint-disable-line
+
+  const {
+    cssClassName,
+    classNameElement,
+    classNameBlock,
+    classNameModifier,
+    classNameBlockModifier
+  } = dsClassnames.convertPropToCssClassName('modal', className, {
     hasError,
     hasWarning,
     hasSuccess,
     modalType,
     size
   });
-  const { WARNING, ERROR, SUCCESS, HELP, INFO } = import_constants.default;
+  const {
+    WARNING,
+    ERROR,
+    SUCCESS,
+    HELP,
+    INFO
+  } = constants.MODAL_TYPE;
   const isAFeedbackType = [WARNING, ERROR, SUCCESS, HELP, INFO].indexOf(modalType) > -1;
   const showFeedBack = isAFeedbackType || hasError || hasWarning || hasSuccess || hasInfo || hasHelp;
-  return /* @__PURE__ */ import_react.default.createElement(import_react_modal.default, {
+  return /*#__PURE__*/_jsx__default["default"](ReactModal__default["default"], {
     testId: dataTestId,
     className: cssClassName,
     contentLabel: modalTitle,
-    isOpen,
-    onAfterOpen,
+    isOpen: isOpen,
+    onAfterOpen: onAfterOpen,
     onRequestClose: onClose,
-    overlayClassName: `${classNameBlock("overlay")} ${classNameModifier(centered && "center")}`,
-    shouldCloseOnOverlayClick,
+    overlayClassName: "".concat(classNameBlock('overlay'), " ").concat(classNameModifier(centered && 'center')),
+    shouldCloseOnOverlayClick: shouldCloseOnOverlayClick,
     style: {
-      content: {
-        ...style
-      },
+      content: _objectSpread({}, style),
       overlay: {
         zIndex
       }
     }
-  }, /* @__PURE__ */ import_react.default.createElement("div", {
-    ...containerProps
-  }, showHeader && /* @__PURE__ */ import_react.default.createElement("div", {
-    className: classNameBlock("modal-header")
-  }, /* @__PURE__ */ import_react.default.createElement("div", {
-    className: classNameElement("title", "modal-header")
-  }, modalTitle), /* @__PURE__ */ import_react.default.createElement("div", {
-    className: classNameElement("icon", "modal-header")
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
-    buttonType: "link",
-    icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Close, null),
-    onClick: onClose,
-    size: iconCloseSize
-  }))), /* @__PURE__ */ import_react.default.createElement("div", {
-    className: classNameElement("body")
-  }, showFeedBack && /* @__PURE__ */ import_react.default.createElement(import_ModalFeedBack.default, {
-    hasError,
-    hasHelp,
-    hasInfo,
-    hasSuccess,
-    hasWarning,
-    modalType
-  }), children), showFooter && !isAFeedbackType && /* @__PURE__ */ import_react.default.createElement("div", {
-    className: `${classNameBlock("modal-footer")} ${additionalFooterCssClass ? classNameBlockModifier(additionalFooterCssClass, "modal-footer") : ""}`
-  }, /* @__PURE__ */ import_react.default.createElement("div", {
-    ref: actionsRef,
-    className: classNameBlock("modal-footer-actions")
-  }, modalType === import_constants.default.CONFIRM && /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
-    buttonType: "secondary",
-    className: `${classNameElement("button-action")} ${classNameModifier("reject", "button-action")} `,
-    labelText: rejectLabel,
-    onClick: onReject,
-    ...overridePropsRejectButton
-  }), /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
-    buttonType: "primary",
-    className: `${classNameElement("button-action")} ${classNameModifier("confirm", "button-action")} `,
-    labelText: confirmLabel,
-    onClick: onConfirm,
-    ...overridePropsConfirmButton
-  })))));
-};
-DSModal.propTypes = {
-  className: import_prop_types.default.string,
-  additionalFooterCssClass: import_prop_types.default.string,
-  style: import_prop_types.default.shape({}),
-  iconCloseSize: import_prop_types.default.oneOf(import_prop_types2.iconSizes),
-  modalType: import_prop_types.default.oneOf(import_constants.modalTypes),
-  showHeader: import_prop_types.default.bool,
-  showFooter: import_prop_types.default.bool,
-  children: import_prop_types.default.oneOfType([import_prop_types.default.element, import_prop_types.default.string, import_prop_types.default.any]).isRequired,
-  centered: import_prop_types.default.bool,
-  confirmLabel: import_prop_types.default.string,
-  modalTitle: import_prop_types.default.string,
-  size: import_prop_types.default.oneOf(import_prop_types2.sizes),
-  isOpen: import_prop_types.default.bool,
-  onClose: import_prop_types.default.func,
-  onAfterOpen: import_prop_types.default.func,
-  onConfirm: import_prop_types.default.func,
-  onReject: import_prop_types.default.func,
-  rejectLabel: import_prop_types.default.string,
-  shouldCloseOnOverlayClick: import_prop_types.default.bool,
-  hasError: import_prop_types.default.bool,
-  hasWarning: import_prop_types.default.bool,
-  hasSuccess: import_prop_types.default.bool,
-  hasInfo: import_prop_types.default.bool,
-  hasHelp: import_prop_types.default.bool,
-  actionsRef: import_prop_types.default.func,
-  appElement: import_prop_types.default.string,
-  overridePropsConfirmButton: import_prop_types.default.shape({}),
-  overridePropsRejectButton: import_prop_types.default.shape({})
+  }, void 0, /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread(_objectSpread({}, containerProps), {}, {
+    children: [showHeader && /*#__PURE__*/_jsx__default["default"]("div", {
+      className: classNameBlock('modal-header')
+    }, void 0, /*#__PURE__*/_jsx__default["default"]("div", {
+      className: classNameElement('title', 'modal-header')
+    }, void 0, modalTitle), /*#__PURE__*/_jsx__default["default"]("div", {
+      className: classNameElement('icon', 'modal-header')
+    }, void 0, /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
+      buttonType: "link",
+      icon: _Close || (_Close = /*#__PURE__*/_jsx__default["default"](dsIcons.Close, {})),
+      onClick: onClose,
+      size: iconCloseSize
+    }))), /*#__PURE__*/_jsx__default["default"]("div", {
+      className: classNameElement('body')
+    }, void 0, showFeedBack && /*#__PURE__*/_jsx__default["default"](ModalFeedBack, {
+      hasError: hasError,
+      hasHelp: hasHelp,
+      hasInfo: hasInfo,
+      hasSuccess: hasSuccess,
+      hasWarning: hasWarning,
+      modalType: modalType
+    }), children), showFooter && !isAFeedbackType && /*#__PURE__*/_jsx__default["default"]("div", {
+      className: "".concat(classNameBlock('modal-footer'), " ").concat(additionalFooterCssClass ? classNameBlockModifier(additionalFooterCssClass, 'modal-footer') : '')
+    }, void 0, /*#__PURE__*/jsxRuntime.jsxs("div", {
+      ref: actionsRef,
+      className: classNameBlock('modal-footer-actions'),
+      children: [modalType === constants.MODAL_TYPE.CONFIRM && /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread({
+        buttonType: "secondary",
+        className: "".concat(classNameElement('button-action'), " ").concat(classNameModifier('reject', 'button-action'), " "),
+        labelText: rejectLabel,
+        onClick: onReject
+      }, overridePropsRejectButton)), /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread({
+        buttonType: "primary",
+        className: "".concat(classNameElement('button-action'), " ").concat(classNameModifier('confirm', 'button-action'), " "),
+        labelText: confirmLabel,
+        onClick: onConfirm
+      }, overridePropsConfirmButton))]
+    }))]
+  })));
 };
-var DSModal_default = DSModal;
-module.exports = __toCommonJS(DSModal_exports);
-//# sourceMappingURL=DSModal.js.map
+
+module.exports = DSModal;

package/cjs/v1/DSModalType.js

@@ -1,45 +1,7 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var DSModalType_exports = {};
-__export(DSModalType_exports, {
-  modalTypes: () => modalTypes
-});
-var React = __toESM(require("react"));
-const modalTypes = [
-  MODAL_TYPE.DEFAULT,
-  MODAL_TYPE.ALERT,
-  MODAL_TYPE.CONFIRM,
-  MODAL_TYPE.NOTIFICATION,
-  MODAL_TYPE.WARNING,
-  MODAL_TYPE.ERROR,
-  MODAL_TYPE.SUCCESS,
-  MODAL_TYPE.HELP,
-  MODAL_TYPE.INFO
-];
-module.exports = __toCommonJS(DSModalType_exports);
-//# sourceMappingURL=DSModalType.js.map
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const modalTypes = [MODAL_TYPE.DEFAULT, MODAL_TYPE.ALERT, MODAL_TYPE.CONFIRM, MODAL_TYPE.NOTIFICATION, MODAL_TYPE.WARNING, MODAL_TYPE.ERROR, MODAL_TYPE.SUCCESS, MODAL_TYPE.HELP, MODAL_TYPE.INFO];
+
+exports.modalTypes = modalTypes;

package/cjs/v1/DSModalWrapper.js

@@ -1,113 +1,149 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var DSModalWrapper_exports = {};
-__export(DSModalWrapper_exports, {
-  default: () => DSModalWrapper_default
-});
-var React = __toESM(require("react"));
-var import_react = require("react");
-var import_constants = require("../constants");
-var DSModalWrapper_default = (WrappedComponent) => {
-  class DSModalWrapper extends import_react.Component {
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
+var react = require('react');
+var constants = require('../constants.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var DSModalWrapper = (WrappedComponent => {
+  class DSModalWrapper extends react.Component {
     constructor() {
       super(...arguments);
       this.state = {
         childready: false,
-        additionalFooterCssClass: "loading",
+        additionalFooterCssClass: 'loading',
         container: null,
         actions: null,
-        height: "100%"
+        height: '100%'
       };
-      this.onHeaderHeight = (e) => {
+
+      this.onHeaderHeight = e => {
         this.heightHeaderFlag = true;
         this.heightHeader = e.height || 0;
       };
-      this.onFooterHeight = (e) => {
+
+      this.onFooterHeight = e => {
         this.heightFooterFlag = true;
         this.heightFooter = e.height || 0;
       };
-      this.onResize = ({ bounds }) => {
+
+      this.onResize = _ref => {
+        let {
+          bounds
+        } = _ref;
+
         if (this.heightFooterFlag && this.heightHeaderFlag) {
           return this.setState({
             height: bounds.height - this.heightFooter - this.heightHeader
           });
         }
-        return setTimeout(this.onResize({ bounds }), 0);
+
+        return setTimeout(this.onResize({
+          bounds
+        }), 0);
       };
-      this.handleContainer = (node) => {
-        if (node)
-          this.setState({ container: node });
+
+      this.handleContainer = node => {
+        if (node) this.setState({
+          container: node
+        });
         this.handleResize();
       };
-      this.handleActions = (node) => {
-        if (node)
-          this.setState({ actions: node });
+
+      this.handleActions = node => {
+        if (node) this.setState({
+          actions: node
+        });
         this.handleResize();
       };
     }
+
     componentDidMount() {
-      window.addEventListener("resize", this.handleResize);
+      window.addEventListener('resize', this.handleResize);
     }
+
     componentWillUnmount() {
-      window.removeEventListener("resize", this.handleResize);
+      window.removeEventListener('resize', this.handleResize);
     }
+
+    /**
+     * Change button width to 100% if the
+     * combined width of the button (or button group) exceed 50% of the container width.
+     */
     handleResize() {
-      if (!this.state)
-        return null;
-      const { container, actions, childready } = this.state;
-      if (!childready)
-        return null;
-      this.setState({ additionalFooterCssClass: null });
-      const { clientWidth: containerWidth } = container;
-      const { clientWidth: actionsWidth } = actions;
+      if (!this.state) return null;
+      const {
+        container,
+        actions,
+        childready
+      } = this.state;
+      if (!childready) return null;
+      this.setState({
+        additionalFooterCssClass: null
+      }); // !important reset to default state to recalculate
+
+      const {
+        clientWidth: containerWidth
+      } = container;
+      const {
+        clientWidth: actionsWidth
+      } = actions; // Change button width to 100% if the combined width of the button (or button group) exceed 50% of the container width.
+
       if (containerWidth && actionsWidth && actionsWidth / containerWidth * 100 > 50) {
-        return this.setState({ additionalFooterCssClass: "fluid-actions" });
+        return this.setState({
+          additionalFooterCssClass: 'fluid-actions'
+        });
       }
-      return this.setState({ additionalFooterCssClass: null });
+
+      return this.setState({
+        additionalFooterCssClass: null
+      });
     }
+
     verifyNodes() {
-      const { modalType } = this.props;
-      if (modalType !== import_constants.MODAL_TYPE.DEFAULT) {
+      const {
+        modalType
+      } = this.props;
+
+      if (modalType !== constants.MODAL_TYPE.DEFAULT) {
         const nodesInterval = setInterval(() => {
-          const { container, actions } = this.state;
-          if (!container || !actions)
-            return null;
+          // !important it checks when nodes are availables
+          const {
+            container,
+            actions
+          } = this.state;
+          if (!container || !actions) return null;
           clearInterval(nodesInterval);
-          this.setState({ childready: true });
+          this.setState({
+            childready: true
+          });
           return this.handleResize();
         }, 100);
       }
     }
+
     render() {
-      const { props, state } = this;
-      const { additionalFooterCssClass, height } = state;
-      return (0, import_react.createElement)(WrappedComponent, {
-        ...props,
+      const {
+        props,
+        state
+      } = this;
+      const {
+        additionalFooterCssClass,
+        height
+      } = state;
+      return /*#__PURE__*/react.createElement(WrappedComponent, _objectSpread(_objectSpread({}, props), {}, {
         height,
         onResize: this.onResize,
         onFooterHeight: this.onFooterHeight,
@@ -116,14 +152,15 @@ var DSModalWrapper_default = (WrappedComponent) => {
         actionsRef: this.handleActions,
         additionalFooterCssClass,
         onAfterOpen: () => {
-          if (props.onAfterOpen)
-            props.onAfterOpen();
+          if (props.onAfterOpen) props.onAfterOpen();
           this.verifyNodes();
         }
-      });
+      }));
     }
+
   }
+
   return DSModalWrapper;
-};
-module.exports = __toCommonJS(DSModalWrapper_exports);
-//# sourceMappingURL=DSModalWrapper.js.map
+});
+
+module.exports = DSModalWrapper;