intelicoreact 1.3.19 → 1.3.21

package/dist/Atomic/UI/Hint/Hint.js

@@ -1,95 +1,132 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _CustomIcons = require("../../../Molecular/CustomIcons");
+
 var _reactDom = require("react-dom");
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _reactFeather = require("react-feather");
+
 require("./Hint.scss");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const time = (Date.now() * Math.random() / 1000).toString().replace(/\./g, '_');
-const Hint = _ref => {
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+
+var time = (Date.now() * Math.random() / 1000).toString().replace(/\./g, '_');
+
+var Hint = function Hint(_ref) {
   var _ref2;
-  let {
-    hint,
-    side = 'right',
-    className,
-    label = '',
-    variant = 'filled',
-    handleOpenType = 'click',
-    onClickCallback,
-    key,
-    id,
-    children,
-    icon,
-    isAccessability = false
-  } = _ref;
-  const hintId = (_ref2 = key !== null && key !== void 0 ? key : id) !== null && _ref2 !== void 0 ? _ref2 : time;
-  const [isOpen, setIsOpen] = (0, _react.useState)(false);
-  const hintRef = (0, _react.useRef)(null);
-  const isCallbackExist = typeof onClickCallback === 'function';
-  const handleClickOutside = event => {
+
+  var hint = _ref.hint,
+      _ref$side = _ref.side,
+      side = _ref$side === void 0 ? 'right' : _ref$side,
+      className = _ref.className,
+      _ref$label = _ref.label,
+      label = _ref$label === void 0 ? '' : _ref$label,
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? 'filled' : _ref$variant,
+      _ref$handleOpenType = _ref.handleOpenType,
+      handleOpenType = _ref$handleOpenType === void 0 ? 'click' : _ref$handleOpenType,
+      onClickCallback = _ref.onClickCallback,
+      key = _ref.key,
+      id = _ref.id,
+      children = _ref.children,
+      icon = _ref.icon,
+      _ref$isAccessability = _ref.isAccessability,
+      isAccessability = _ref$isAccessability === void 0 ? false : _ref$isAccessability;
+  var hintId = (_ref2 = key !== null && key !== void 0 ? key : id) !== null && _ref2 !== void 0 ? _ref2 : time;
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      isOpen = _useState2[0],
+      setIsOpen = _useState2[1];
+
+  var hintRef = (0, _react.useRef)(null);
+  var isCallbackExist = typeof onClickCallback === 'function';
+
+  var handleClickOutside = function handleClickOutside(event) {
     if (!getHintContainer().contains(event === null || event === void 0 ? void 0 : event.target)) {
       setIsOpen(false);
     }
   };
-  const getParentNode = () => {
+
+  var getParentNode = function getParentNode() {
     var _document$querySelect;
+
     return (_document$querySelect = document.querySelector('div#root')) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector('div#app');
   };
-  const initHintContainer = () => {
-    const hint = document.createElement('div');
+
+  var initHintContainer = function initHintContainer() {
+    var hint = document.createElement('div');
     hint.setAttribute('id', hintId);
     hint.classList.add('hint__container');
     getParentNode().append(hint);
   };
-  const getHintContainer = () => {
+
+  var getHintContainer = function getHintContainer() {
     return document.getElementById(hintId);
   };
-  const getHintMarkUp = () => {
+
+  var getHintMarkUp = function getHintMarkUp() {
     return /*#__PURE__*/_react.default.createElement("div", {
       "data-testid": 'test-hint-text',
       className: (0, _classnames.default)('hint__text', "hint__text_".concat(side))
     }, hint, children);
   };
-  const setHintContainerStyles = () => {
+
+  var setHintContainerStyles = function setHintContainerStyles() {
     var _sw$getBoundingClient;
-    const hc = getHintContainer();
+
+    var hc = getHintContainer();
     if (!hc || !isOpen) return false;
-    const {
-      width,
-      height,
-      left,
-      top,
-      bottom
-    } = (hintRef === null || hintRef === void 0 ? void 0 : hintRef.current.getBoundingClientRect()) || {};
-    const sw = hc.getElementsByClassName('hint__text')[0];
-    const swHeight = sw === null || sw === void 0 || (_sw$getBoundingClient = sw.getBoundingClientRect()) === null || _sw$getBoundingClient === void 0 ? void 0 : _sw$getBoundingClient.height;
+
+    var _ref3 = (hintRef === null || hintRef === void 0 ? void 0 : hintRef.current.getBoundingClientRect()) || {},
+        width = _ref3.width,
+        height = _ref3.height,
+        left = _ref3.left,
+        top = _ref3.top,
+        bottom = _ref3.bottom;
+
+    var sw = hc.getElementsByClassName('hint__text')[0];
+    var swHeight = sw === null || sw === void 0 ? void 0 : (_sw$getBoundingClient = sw.getBoundingClientRect()) === null || _sw$getBoundingClient === void 0 ? void 0 : _sw$getBoundingClient.height;
     hc.style.width = isOpen ? width === null || width === void 0 ? void 0 : width.toString().concat('px') : 0;
     hc.style.left = isOpen ? left === null || left === void 0 ? void 0 : left.toString().concat('px') : 0;
     hc.style.top = isOpen ? top === null || top === void 0 ? void 0 : top.toString().concat('px') : 0;
     hc.style.maxHeight = isOpen ? swHeight === null || swHeight === void 0 ? void 0 : swHeight.toString().concat('px') : 0;
   };
-  const renderHintContainer = () => {
-    const hc = getHintContainer();
+
+  var renderHintContainer = function renderHintContainer() {
+    var hc = getHintContainer();
     if (!hc) return null;
     return /*#__PURE__*/(0, _reactDom.createPortal)(getHintMarkUp(), hc);
   };
-  (0, _react.useEffect)(() => {
+
+  (0, _react.useEffect)(function () {
     initHintContainer();
   }, []);
-  (0, _react.useEffect)(() => {
+  (0, _react.useEffect)(function () {
     setHintContainerStyles();
   }, [isOpen]);
-  (0, _react.useEffect)(() => {
+  (0, _react.useEffect)(function () {
     document.addEventListener('click', handleClickOutside, true);
-    return () => document.removeEventListener('click', handleClickOutside, true);
+    return function () {
+      return document.removeEventListener('click', handleClickOutside, true);
+    };
   });
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('hint', className),
@@ -98,9 +135,15 @@ const Hint = _ref => {
     "tab-index": isAccessability ? 0 : -1,
     "data-testid": label ? label === null || label === void 0 ? void 0 : label.replace(/\s/g, '-') : 'test-hint',
     "aria-label": isAccessability && label || '',
-    onClick: () => handleOpenType === 'click' && (isCallbackExist ? onClickCallback() : setIsOpen(!isOpen)),
-    onMouseEnter: () => handleOpenType === 'hover' && setIsOpen(!isOpen),
-    onMouseLeave: () => handleOpenType === 'hover' && handleClickOutside(),
+    onClick: function onClick() {
+      return handleOpenType === 'click' && (isCallbackExist ? onClickCallback() : setIsOpen(!isOpen));
+    },
+    onMouseEnter: function onMouseEnter() {
+      return handleOpenType === 'hover' && setIsOpen(!isOpen);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return handleOpenType === 'hover' && handleClickOutside();
+    },
     className: (0, _classnames.default)('hint__button', {
       hint__button_active: isOpen
     })
@@ -121,4 +164,6 @@ const Hint = _ref => {
     })
   }, label[0].toUpperCase() + label.slice(1))), isOpen && renderHintContainer());
 };
-var _default = exports.default = Hint;
+
+var _default = Hint;
+exports.default = _default;

package/dist/Atomic/UI/Modal/Modal.js

@@ -1,187 +1,217 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.renderModalTitle = exports.default = exports.KEY_CODE = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _react = _interopRequireWildcard(require("react"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _Button = _interopRequireDefault(require("../Button/Button"));
+
 var _ModalFooter = _interopRequireDefault(require("./partials/ModalFooter"));
+
 var _ModalTitle = _interopRequireDefault(require("./partials/ModalTitle"));
-var _useMobileModal = _interopRequireDefault(require("./partials/useMobileModal"));
+
+var _useMobileModal2 = _interopRequireDefault(require("./partials/useMobileModal"));
+
 require("./Modal.scss");
+
 require("./ModalMobile.scss");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const KEY_CODE = exports.KEY_CODE = Object.freeze({
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+
+var KEY_CODE = Object.freeze({
   ENTER: 13,
   ESC: 27
 });
-const renderModalTitle = _ref => {
-  let {
-    mode,
-    title,
-    onlyTitle
-  } = _ref;
+exports.KEY_CODE = KEY_CODE;
+
+var renderModalTitle = function renderModalTitle(_ref) {
+  var mode = _ref.mode,
+      title = _ref.title,
+      onlyTitle = _ref.onlyTitle;
   if (mode && mode !== 'default' && !onlyTitle) return "".concat(mode[0].toUpperCase() + mode.slice(1), " ").concat(title);
   return title;
-};
+}; // eslint-disable-next-line react/display-name
+
 
-// eslint-disable-next-line react/display-name
 exports.renderModalTitle = renderModalTitle;
-const Modal = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
-  let {
-    zIndex = 100,
-    isOpen,
-    onConfirm,
-    onDecline,
-    closeModal,
-    children,
-    className,
-    title,
-    variant,
-    onlyTitle,
-    mode,
-    size,
-    atributesForModalBody = {},
-    confirmBtnClassName,
-    confirmBtnLabel,
-    confirmBtnVariant = 'primary',
-    confirmBtnDisable,
-    confirmBtnIcon,
-    isConfirmBtnIconPositionRight,
-    noConfirmBtn,
-    noCloseBtn,
-    noFooter,
-    noHeader,
-    closeBtnClassName,
-    closeBtnText,
-    closeBtnVariant,
-    closeBtnDisable,
-    closeBtnIcon,
-    forced,
-    btnClassNames,
-    isCloseBtnIconPositionRight,
-    submitOnEnter = false,
-    closeOnEsc = false,
-    leftContentOfFooter,
-    customFooter,
-    testId,
-    noHeaderCloseBtn,
-    withMobileLogic
-  } = _ref2;
-  const modalRef = ref || (0, _react.useRef)(null);
-  const {
-    modalMobileHeaderRef,
-    modalMobileBodyRef,
-    modalMobileFooterRef,
-    MODALS_LOGIC,
-    renderModal,
-    isMobile,
-    scrollTop,
-    scrollHeight
-  } = (0, _useMobileModal.default)({
-    modalRef,
-    withMobileLogic,
-    isOpen,
-    children
-  });
-  const handle = {
-    confirm: () => {
-      onConfirm === null || onConfirm === void 0 || onConfirm();
+
+var Modal = /*#__PURE__*/_react.default.forwardRef(function (_ref2, ref) {
+  var _ref2$zIndex = _ref2.zIndex,
+      zIndex = _ref2$zIndex === void 0 ? 100 : _ref2$zIndex,
+      isOpen = _ref2.isOpen,
+      onConfirm = _ref2.onConfirm,
+      onDecline = _ref2.onDecline,
+      closeModal = _ref2.closeModal,
+      children = _ref2.children,
+      className = _ref2.className,
+      title = _ref2.title,
+      variant = _ref2.variant,
+      onlyTitle = _ref2.onlyTitle,
+      mode = _ref2.mode,
+      size = _ref2.size,
+      _ref2$atributesForMod = _ref2.atributesForModalBody,
+      atributesForModalBody = _ref2$atributesForMod === void 0 ? {} : _ref2$atributesForMod,
+      confirmBtnClassName = _ref2.confirmBtnClassName,
+      confirmBtnLabel = _ref2.confirmBtnLabel,
+      _ref2$confirmBtnVaria = _ref2.confirmBtnVariant,
+      confirmBtnVariant = _ref2$confirmBtnVaria === void 0 ? 'primary' : _ref2$confirmBtnVaria,
+      confirmBtnDisable = _ref2.confirmBtnDisable,
+      confirmBtnIcon = _ref2.confirmBtnIcon,
+      isConfirmBtnIconPositionRight = _ref2.isConfirmBtnIconPositionRight,
+      noConfirmBtn = _ref2.noConfirmBtn,
+      noCloseBtn = _ref2.noCloseBtn,
+      noFooter = _ref2.noFooter,
+      noHeader = _ref2.noHeader,
+      closeBtnClassName = _ref2.closeBtnClassName,
+      closeBtnText = _ref2.closeBtnText,
+      closeBtnVariant = _ref2.closeBtnVariant,
+      closeBtnDisable = _ref2.closeBtnDisable,
+      closeBtnIcon = _ref2.closeBtnIcon,
+      forced = _ref2.forced,
+      btnClassNames = _ref2.btnClassNames,
+      isCloseBtnIconPositionRight = _ref2.isCloseBtnIconPositionRight,
+      _ref2$submitOnEnter = _ref2.submitOnEnter,
+      submitOnEnter = _ref2$submitOnEnter === void 0 ? false : _ref2$submitOnEnter,
+      _ref2$closeOnEsc = _ref2.closeOnEsc,
+      closeOnEsc = _ref2$closeOnEsc === void 0 ? false : _ref2$closeOnEsc,
+      leftContentOfFooter = _ref2.leftContentOfFooter,
+      customFooter = _ref2.customFooter,
+      testId = _ref2.testId,
+      noHeaderCloseBtn = _ref2.noHeaderCloseBtn,
+      withMobileLogic = _ref2.withMobileLogic;
+  var modalRef = ref || (0, _react.useRef)(null);
+
+  var _useMobileModal = (0, _useMobileModal2.default)({
+    modalRef: modalRef,
+    withMobileLogic: withMobileLogic,
+    isOpen: isOpen,
+    children: children
+  }),
+      modalMobileHeaderRef = _useMobileModal.modalMobileHeaderRef,
+      modalMobileBodyRef = _useMobileModal.modalMobileBodyRef,
+      modalMobileFooterRef = _useMobileModal.modalMobileFooterRef,
+      MODALS_LOGIC = _useMobileModal.MODALS_LOGIC,
+      renderModal = _useMobileModal.renderModal,
+      isMobile = _useMobileModal.isMobile,
+      scrollTop = _useMobileModal.scrollTop,
+      scrollHeight = _useMobileModal.scrollHeight;
+
+  var handle = {
+    confirm: function confirm() {
+      onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm();
     },
-    decline: () => {
+    decline: function decline() {
       //? closeModal используется для ESC и оверлея, давно хотелось иметь возможность разделить
       //? Теперь можно не передавать closeModal, а для cancel-кнопки передать отдельный обработчик
-      if (typeof onDecline === 'function') onDecline();else closeModal === null || closeModal === void 0 || closeModal();
+      if (typeof onDecline === 'function') onDecline();else closeModal === null || closeModal === void 0 ? void 0 : closeModal();
     },
-    pressEnter: event => {
+    pressEnter: function pressEnter(event) {
       if (event.keyCode === KEY_CODE.ENTER && !event.repeat) handle.confirm();
     },
-    pressEsc: () => {
-      if (event.keyCode === KEY_CODE.ESC && !event.repeat) closeModal === null || closeModal === void 0 || closeModal();
+    pressEsc: function pressEsc() {
+      if (event.keyCode === KEY_CODE.ESC && !event.repeat) closeModal === null || closeModal === void 0 ? void 0 : closeModal();
     }
   };
-  (0, _react.useEffect)(() => {
+  (0, _react.useEffect)(function () {
     if (submitOnEnter) document.addEventListener('keyup', handle.pressEnter);
     if (closeOnEsc) document.addEventListener('keyup', handle.pressEsc);
-    return () => {
+    return function () {
       document.removeEventListener('keyup', handle.pressEnter);
       document.removeEventListener('keyup', handle.pressEsc);
     };
   }, [submitOnEnter, closeOnEsc]);
-  const render = () => !isOpen ? null : /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      zIndex
-    },
-    "data-testid": testId,
-    className: "modal-box j5"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": 'modal-closeOverlay',
-    className: isOpen ? 'modal-overlay' : 'hidden',
-    onClick: closeModal
-  }), renderModal( /*#__PURE__*/_react.default.createElement("div", {
-    ref: modalRef,
-    style: {
-      width: size
-    },
-    className: (0, _classnames.default)(className, {
-      modal: isOpen,
-      'modal--no-header': isOpen && noHeader,
-      'modal-mobile': isOpen && isMobile,
-      hidden: !isOpen
-    })
-  }, !noHeader && /*#__PURE__*/_react.default.createElement(_ModalTitle.default, {
-    wrapperRef: modalMobileHeaderRef,
-    className: (0, _classnames.default)({
-      'modal__header--hidden': MODALS_LOGIC.IS_HEADER_HIDDEN,
-      'modal__header--sticky': !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY
-    }),
-    variant: variant,
-    isForced: forced,
-    onClose: handle.decline,
-    noHeaderCloseBtn: noHeaderCloseBtn
-  }, /*#__PURE__*/_react.default.createElement("span", null, renderModalTitle({
-    mode,
-    title,
-    onlyTitle
-  }))), /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, atributesForModalBody, {
-    ref: modalMobileBodyRef,
-    className: (0, _classnames.default)('modal__body', {
-      'modal__body--no-footer': noFooter
-    })
-  }), children), (!noFooter || customFooter) && /*#__PURE__*/_react.default.createElement(_ModalFooter.default, {
-    wrapperRef: modalMobileFooterRef,
-    className: (0, _classnames.default)({
-      'modal__footer--hidden': MODALS_LOGIC.IS_FOOTER_HIDDEN,
-      'modal__footer--sticky': !MODALS_LOGIC.IS_FOOTER_HIDDEN && MODALS_LOGIC.IS_FOOTER_STICKY && scrollTop !== scrollHeight,
-      'modal__footer_with-left-content': leftContentOfFooter
-    })
-  }, customFooter || /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, leftContentOfFooter, (!noCloseBtn || !noConfirmBtn) && /*#__PURE__*/_react.default.createElement("div", {
-    className: "modal__buttons-block"
-  }, !noCloseBtn && /*#__PURE__*/_react.default.createElement(_Button.default, {
-    testId: "modal",
-    className: (0, _classnames.default)(closeBtnClassName, btnClassNames),
-    variant: closeBtnVariant || 'dark-outline',
-    onClick: () => handle.decline(),
-    label: closeBtnText || 'Cancel',
-    disabled: closeBtnDisable,
-    icon: closeBtnIcon,
-    isIconRight: isCloseBtnIconPositionRight,
-    tabIndex: 1
-  }), !noConfirmBtn && /*#__PURE__*/_react.default.createElement(_Button.default, {
-    testId: "modal",
-    onClick: () => handle.confirm(),
-    label: confirmBtnLabel || (mode === null || mode === void 0 ? void 0 : mode[0].toUpperCase()) + (mode === null || mode === void 0 ? void 0 : mode.slice(1)) || 'Apply',
-    className: (0, _classnames.default)('ml5', confirmBtnClassName, btnClassNames),
-    variant: confirmBtnVariant,
-    disabled: confirmBtnDisable,
-    icon: confirmBtnIcon,
-    isIconRight: isConfirmBtnIconPositionRight
-  })))))));
+
+  var render = function render() {
+    return !isOpen ? null : /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        zIndex: zIndex
+      },
+      "data-testid": testId,
+      className: "modal-box j5"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      "data-testid": 'modal-closeOverlay',
+      className: isOpen ? 'modal-overlay' : 'hidden',
+      onClick: closeModal
+    }), renderModal( /*#__PURE__*/_react.default.createElement("div", {
+      ref: modalRef,
+      style: {
+        width: size
+      },
+      className: (0, _classnames.default)(className, {
+        modal: isOpen,
+        'modal--no-header': isOpen && noHeader,
+        'modal-mobile': isOpen && isMobile,
+        hidden: !isOpen
+      })
+    }, !noHeader && /*#__PURE__*/_react.default.createElement(_ModalTitle.default, {
+      wrapperRef: modalMobileHeaderRef,
+      className: (0, _classnames.default)({
+        'modal__header--hidden': MODALS_LOGIC.IS_HEADER_HIDDEN,
+        'modal__header--sticky': !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY
+      }),
+      variant: variant,
+      isForced: forced,
+      onClose: handle.decline,
+      noHeaderCloseBtn: noHeaderCloseBtn
+    }, /*#__PURE__*/_react.default.createElement("span", null, renderModalTitle({
+      mode: mode,
+      title: title,
+      onlyTitle: onlyTitle
+    }))), /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, atributesForModalBody, {
+      ref: modalMobileBodyRef,
+      className: (0, _classnames.default)('modal__body', {
+        'modal__body--no-footer': noFooter
+      })
+    }), children), (!noFooter || customFooter) && /*#__PURE__*/_react.default.createElement(_ModalFooter.default, {
+      wrapperRef: modalMobileFooterRef,
+      className: (0, _classnames.default)({
+        'modal__footer--hidden': MODALS_LOGIC.IS_FOOTER_HIDDEN,
+        'modal__footer--sticky': !MODALS_LOGIC.IS_FOOTER_HIDDEN && MODALS_LOGIC.IS_FOOTER_STICKY && scrollTop !== scrollHeight,
+        'modal__footer_with-left-content': leftContentOfFooter
+      })
+    }, customFooter || /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, leftContentOfFooter, (!noCloseBtn || !noConfirmBtn) && /*#__PURE__*/_react.default.createElement("div", {
+      className: "modal__buttons-block"
+    }, !noCloseBtn && /*#__PURE__*/_react.default.createElement(_Button.default, {
+      testId: "modal",
+      className: (0, _classnames.default)(closeBtnClassName, btnClassNames),
+      variant: closeBtnVariant || 'dark-outline',
+      onClick: function onClick() {
+        return handle.decline();
+      },
+      label: closeBtnText || 'Cancel',
+      disabled: closeBtnDisable,
+      icon: closeBtnIcon,
+      isIconRight: isCloseBtnIconPositionRight,
+      tabIndex: 1
+    }), !noConfirmBtn && /*#__PURE__*/_react.default.createElement(_Button.default, {
+      testId: "modal",
+      onClick: function onClick() {
+        return handle.confirm();
+      },
+      label: confirmBtnLabel || (mode === null || mode === void 0 ? void 0 : mode[0].toUpperCase()) + (mode === null || mode === void 0 ? void 0 : mode.slice(1)) || 'Apply',
+      className: (0, _classnames.default)('ml5', confirmBtnClassName, btnClassNames),
+      variant: confirmBtnVariant,
+      disabled: confirmBtnDisable,
+      icon: confirmBtnIcon,
+      isIconRight: isConfirmBtnIconPositionRight
+    })))))));
+  };
+
   return render();
 });
-var _default = exports.default = Modal;
+
+var _default = Modal;
+exports.default = _default;

package/dist/Atomic/UI/Modal/ModalHOC.js

@@ -1,30 +1,37 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
 var _react = _interopRequireDefault(require("react"));
+
 var _classnames = _interopRequireDefault(require("classnames"));
+
 var _reactFeather = require("react-feather");
+
 require("./Modal.scss");
+
 var _Modal2 = require("./Modal");
+
 var _ModalTitle = _interopRequireDefault(require("./partials/ModalTitle"));
-const Modal = _ref => {
-  let {
-    zIndex = 100,
-    isOpen,
-    closeModal,
-    children,
-    className,
-    size,
-    testId
-  } = _ref;
+
+var Modal = function Modal(_ref) {
+  var _ref$zIndex = _ref.zIndex,
+      zIndex = _ref$zIndex === void 0 ? 100 : _ref$zIndex,
+      isOpen = _ref.isOpen,
+      closeModal = _ref.closeModal,
+      children = _ref.children,
+      className = _ref.className,
+      size = _ref.size,
+      testId = _ref.testId;
   if (!isOpen) return null;
   return /*#__PURE__*/_react.default.createElement("div", {
     style: {
-      zIndex
+      zIndex: zIndex
     },
     "data-testid": testId,
     className: "modal-box j5"
@@ -39,4 +46,6 @@ const Modal = _ref => {
     className: (0, _classnames.default)(className, 'modal')
   }, children));
 };
-var _default = exports.default = Modal;
+
+var _default = Modal;
+exports.default = _default;