intelicoreact 1.5.32 → 1.5.34

package/dist/Atomic/UI/Modal/Modal.scss

@@ -1,332 +0,0 @@
-@import "../../../scss/_vars";
-@import "../../../scss/mixins";
-
-.modal-overlay {
-  position: fixed;
-  z-index: 4;
-  top: 0;
-  left: 0;
-
-  width: 100%;
-  height: 100%;
-
-  opacity: 0.5;
-  background-color: black;
-
-  transition: opacity 0.2s ease;
-}
-
-.modal {
-  --modal-min-height: 300px;
-  --max-height: calc(100% - 30px);
-
-  position: relative;
-  z-index: 5;
-
-  display: flex;
-  flex-direction: column;
-
-  width: 600px;
-  min-height: var(--modal-min-height);
-  max-height: var(--max-height);
-  margin: 0 10px;
-
-  border-radius: 6px;
-  background-color: #fff;
-  box-shadow: 0 20px 20px rgb(0 0 0 / 20%);
-
-  &__header {
-    position: relative;
-
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-
-    padding: 10px 15px;
-
-    border-bottom: 1px solid #e2e5ec;
-    border-top-left-radius: 4px;
-    border-top-right-radius: 4px;
-    background-color: #f7fafc;
-
-    &-primary {
-      background-color: $color--primary;
-
-      &-title {
-        font-size: 16px;
-        font-weight: 400;
-
-        color: #ffffff;
-      }
-    }
-
-    &-title {
-      font-size: 16px;
-      font-weight: normal;
-
-      color: $color--primary;
-    }
-  }
-
-  &__body {
-    overflow-y: auto;
-    flex-grow: 1;
-
-    box-sizing: border-box;
-    padding: 15px;
-
-    border-bottom-right-radius: 4px;
-    border-bottom-left-radius: 4px;
-    background-color: #f7fafc;
-
-    @include custom-scroll2;
-    &:first-of-type {
-      border-top-left-radius: 4px;
-      border-top-right-radius: 4px;
-    }
-
-    &--no-footer {
-      padding: 15px;
-    }
-  }
-
-  &__footer {
-    display: flex;
-    justify-content: flex-end;
-    align-items: center;
-
-    padding: 7.5px 15px;
-
-    border-top: 1px solid #e2e5ec;
-    border-bottom-right-radius: 4px;
-    border-bottom-left-radius: 4px;
-    background-color: #f7fafc;
-
-    &_with-left-content {
-      justify-content: space-between;
-    }
-
-    &--inbody {
-      position: absolute;
-      bottom: 0;
-      left: 0;
-
-      width: calc(100% - 30px);
-
-      background-color: #ffff;
-    }
-  }
-
-  &__buttons-block {
-    display: flex;
-    flex-flow: row nowrap;
-    justify-content: flex-start;
-    align-items: center;
-  }
-}
-
-.modal__footer--noborder {
-  border-top: none;
-}
-
-.modal-box {
-  position: fixed;
-  z-index: 100;
-  inset: 0;
-
-  animation-name: fadeIn;
-  animation-duration: 0.25s;
-  animation-timing-function: ease;
-  animation-fill-mode: forwards;
-}
-
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
-.consumer-info-modal {
-  overflow-x: auto;
-
-  .button-fin {
-    background-color: #ffff;
-  }
-
-  .modal__body {
-    min-height: 200px;
-    padding: 0 15px;
-  }
-}
-
-.modal-close-icon-box {
-  position: absolute;
-  top: 0;
-  right: 0;
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  width: 40px;
-  height: 100%;
-
-  cursor: pointer;
-
-  color: #1e1e2d;
-  //background-color: inherit;
-  border-top-right-radius: 5px;
-  background: transparent;
-
-  &:hover {
-    background-color: #e2e5ec;
-  }
-
-  &-primary {
-    color: #1e1e2d;
-
-    &:hover {
-      opacity: 1;
-      background-color: #5162d4;
-    }
-  }
-
-  &-merchant {
-    color: #1e1e2d;
-
-    &:hover {
-      opacity: 1;
-      background-color: #5162d4;
-    }
-  }
-}
-
-.modal-close-icon {
-  width: 20px;
-  min-width: 20px;
-  height: 20px;
-}
-
-.modal-text-card {
-  padding: 15px 0;
-
-  font-size: 13px;
-  font-weight: 400;
-  line-height: 20px;
-  text-align: left;
-  white-space: normal;
-}
-
-.prompt-text-card {
-  padding: 0;
-}
-
-.included-selector-modal {
-  &--box {
-    overflow-x: auto;
-
-    max-height: calc(100% - 32px);
-  }
-
-  &__th {
-    &--id {
-      width: 1%;
-    }
-  }
-
-  &__td {
-    &--id {
-      color: #9aa0b9;
-    }
-  }
-
-  .simple-table {
-    overflow-x: unset;
-
-    min-height: 400px;
-    max-height: 500px;
-
-    thead {
-      background-color: unset;
-
-      th {
-        padding: 10px 15px;
-
-        font-weight: 400;
-
-        border-right: 1px solid #e2e5ec;
-      }
-
-      th:first-child,
-      th:last-child {
-        border: none;
-      }
-    }
-
-    tbody {
-      tr:first-child {
-        position: relative;
-
-        &::after {
-          position: absolute;
-          top: 0;
-          left: 0;
-
-          width: 100%;
-          height: 8px;
-
-          content: "";
-
-          background: linear-gradient(
-            180deg,
-            rgb(0 0 0 / 15.2%) 0%,
-            rgb(0 0 0 / 0%) 100%
-          );
-        }
-      }
-
-      tr:last-child {
-        border-bottom: none;
-      }
-    }
-
-    td {
-      padding: 2.25px 15px;
-    }
-
-    .tr-as-selector:hover td {
-      background-color: #ffedc8;
-    }
-  }
-}
-
-.reports-settings-modal-box {
-  .modal__body {
-    padding: 0;
-  }
-}
-
-.confirm-modal {
-  border-radius: 4px;
-
-  .modal {
-    &__header-title {
-      font-size: 13px;
-      font-weight: 700;
-    }
-
-    &__body {
-      .modal-text-card {
-        padding: 0;
-      }
-    }
-
-    &__footer {
-      background-color: #ffff;
-    }
-  }
-}

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

@@ -1,43 +0,0 @@
-"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 _useHandleKeyPress = _interopRequireDefault(require("../../../Functions/useKeyPress/useHandleKeyPress"));
-require("./Modal.scss");
-const Modal = _ref => {
-  let {
-    zIndex = 100,
-    isOpen,
-    closeModal,
-    children,
-    className,
-    size,
-    testId,
-    closeOnEsc = true
-  } = _ref;
-  if (!isOpen) return null;
-  (0, _useHandleKeyPress.default)({
-    escCallback: closeOnEsc && typeof closeModal === "function" ? () => closeModal === null || closeModal === void 0 ? void 0 : closeModal() : null
-  });
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      zIndex
-    },
-    "data-testid": testId,
-    className: "modal-box j5"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "modal-overlay",
-    onClick: closeModal
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      width: size
-    },
-    className: (0, _classnames.default)(className, "modal")
-  }, children));
-};
-var _default = exports.default = Modal;

package/dist/Atomic/UI/Modal/ModalMobile.scss

@@ -1,70 +0,0 @@
-@keyframes slideup {
-  from {
-    transform: translateY(100%);
-  }
-
-  to {
-    transform: translateY(0);
-  }
-}
-
-@media only screen and (max-width: 768px) {
-  .modal-mobile-container {
-    position: relative;
-    z-index: 100;
-
-    overflow-y: auto;
-
-    box-sizing: border-box;
-    width: 100dvw;
-    height: 100dvh;
-
-    border-radius: 16px 16px 0 0;
-
-    .modal {
-      max-width: 100vw;
-      max-height: unset !important;
-      margin-top: 16px !important;
-
-      border-radius: 16px 16px 0 0;
-
-      animation-name: slideup;
-      animation-duration: 0.4s;
-
-      &__header,
-      &__footer {
-        z-index: 2;
-        left: 0;
-
-        box-sizing: border-box;
-        width: 100%;
-
-        &--hidden {
-          position: relative;
-        }
-
-        &--sticky {
-          position: sticky;
-
-          box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.15);
-        }
-      }
-
-      &__header {
-        top: 0;
-      }
-
-      &__footer {
-        border-radius: 0 !important;
-      }
-
-      &__footer {
-        bottom: 0;
-      }
-    }
-
-    .modal:not(.modal--no-header) .modal__body {
-      border-radius: 0 !important;
-    }
-  }
-}

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

@@ -1,21 +0,0 @@
-"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"));
-const ModalFooter = _ref => {
-  let {
-    className = "",
-    children,
-    wrapperRef
-  } = _ref;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    ref: wrapperRef,
-    className: (0, _classnames.default)("modal__footer", className)
-  }, children);
-};
-var _default = exports.default = ModalFooter;

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

@@ -1,41 +0,0 @@
-"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");
-const ModalTitle = _ref => {
-  let {
-    variant = "primary",
-    children,
-    isForced,
-    onClose,
-    noHeaderCloseBtn,
-    className,
-    wrapperRef,
-    testId = "modal-title"
-  } = _ref;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": testId,
-    ref: wrapperRef,
-    className: (0, _classnames.default)("modal__header", className, {
-      ["modal__header-".concat(variant)]: variant
-    })
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: (0, _classnames.default)("modal__header-title", {
-      ["modal__header-".concat(variant, "-title")]: variant
-    })
-  }, children), !isForced && /*#__PURE__*/_react.default.createElement("div", {
-    onClick: onClose,
-    className: (0, _classnames.default)("modal-close-icon-box", {
-      "modal-close-icon-box-primary": variant === "primary"
-    })
-  }, !noHeaderCloseBtn && /*#__PURE__*/_react.default.createElement(_reactFeather.X, {
-    className: "modal-close-icon"
-  })));
-};
-var _default = exports.default = ModalTitle;

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

@@ -1,171 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useMobileModal;
-var _react = _interopRequireWildcard(require("react"));
-var _useIsMobile = _interopRequireDefault(require("../../../../Functions/useIsMobile"));
-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 SCROLL_DIRECTION = {
-  UP: "up",
-  DOWN: "down"
-};
-function useMobileModal(_ref) {
-  var _modalMobileHeaderRef3, _modalMobileFooterRef3;
-  let {
-    modalRef = null,
-    withMobileLogic = false,
-    withFixedFooter,
-    isOpen
-  } = _ref;
-  const modalMobileContainerRef = (0, _react.useRef)(null);
-  const modalMobileHeaderRef = (0, _react.useRef)(null);
-  const modalMobileFooterRef = (0, _react.useRef)(null);
-  const modalMobileBodyRef = (0, _react.useRef)(null);
-  const {
-    isMobile
-  } = (0, _useIsMobile.default)();
-  const [modalHeight, setModalHeight] = (0, _react.useState)(0);
-  const [modalsLogic, setModalsLogic] = (0, _react.useState)({
-    IS_HEADER_HIDDEN: false,
-    IS_HEADER_STICKY: false,
-    IS_FOOTER_HIDDEN: false,
-    IS_FOOTER_STICKY: false
-  });
-  const [modalsLogicProps, setModalsLogicProps] = (0, _react.useState)({
-    headerHeight: 0,
-    footerHeight: 0
-  });
-  const [scrollDirection, setScrollDirection] = (0, _react.useState)(SCROLL_DIRECTION.UP);
-  const [scrollTopPrev, setScrollTopPrev] = (0, _react.useState)(0);
-  const [scrollTop, setScrollTop] = (0, _react.useState)(0);
-  const [scrollHeight, setScrollHeight] = (0, _react.useState)(1);
-  const [containerScrollHeight, setContainerScrollHeight] = (0, _react.useState)(1);
-
-  /* MODALS LOGIC | BEGIN */
-  // Count ScrollTop
-  (0, _react.useLayoutEffect)(() => {
-    const el = modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current;
-    if (el) {
-      el.addEventListener("scroll", () => {
-        setScrollTop(scrollTop => {
-          if (scrollTop !== el.scrollTop) setScrollTopPrev(scrollTop);
-          return el.scrollTop;
-        });
-      });
-    }
-  }, [modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current]);
-  // Count ScrollDirection
-  (0, _react.useEffect)(() => {
-    setScrollDirection(prevScrollDirection => scrollTop < scrollTopPrev ? SCROLL_DIRECTION.UP : scrollTop > scrollTopPrev ? SCROLL_DIRECTION.DOWN : prevScrollDirection);
-  }, [scrollTop, scrollTopPrev]);
-  // Dynamic Modal Positioning
-  (0, _react.useLayoutEffect)(() => {
-    if (isOpen) {
-      const modalStyle = modalRef !== null && modalRef !== void 0 && modalRef.current ? (modalRef === null || modalRef === void 0 ? void 0 : modalRef.current.currentStyle) || window.getComputedStyle(modalRef === null || modalRef === void 0 ? void 0 : modalRef.current) : {};
-      const computedModalHeight = modalRef !== null && modalRef !== void 0 && modalRef.current ? modalHeight + parseFloat((modalStyle === null || modalStyle === void 0 ? void 0 : modalStyle.marginTop) || 0) : 0;
-      const windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
-      if (modalMobileContainerRef !== null && modalMobileContainerRef !== void 0 && modalMobileContainerRef.current) {
-        if (computedModalHeight <= windowHeight) {
-          modalMobileContainerRef.current.style.display = "flex";
-          modalMobileContainerRef.current.style.alignItems = "flex-end";
-        } else {
-          var _modalMobileContainer, _modalMobileContainer2;
-          (_modalMobileContainer = modalMobileContainerRef.current) === null || _modalMobileContainer === void 0 || (_modalMobileContainer = _modalMobileContainer.style) === null || _modalMobileContainer === void 0 || _modalMobileContainer.removeProperty("display");
-          (_modalMobileContainer2 = modalMobileContainerRef.current) === null || _modalMobileContainer2 === void 0 || (_modalMobileContainer2 = _modalMobileContainer2.style) === null || _modalMobileContainer2 === void 0 || _modalMobileContainer2.removeProperty("align-items");
-        }
-      }
-    }
-  }, [modalsLogicProps, isOpen, isMobile, modalHeight]);
-
-  // Calculating
-  (0, _react.useLayoutEffect)(() => {
-    if (isMobile && isOpen) {
-      var _modalRef$current;
-      const newModalHeight = modalRef === null || modalRef === void 0 || (_modalRef$current = modalRef.current) === null || _modalRef$current === void 0 || (_modalRef$current = _modalRef$current.getBoundingClientRect()) === null || _modalRef$current === void 0 ? void 0 : _modalRef$current.height;
-      if (modalHeight !== newModalHeight) {
-        setModalHeight(newModalHeight);
-      }
-    }
-  });
-  (0, _react.useEffect)(() => {
-    if (isMobile && withMobileLogic) {
-      const {
-        footerHeight,
-        headerHeight
-      } = modalsLogicProps;
-      setModalsLogic(prevStickyLogic => ({
-        IS_HEADER_HIDDEN: scrollDirection === SCROLL_DIRECTION.DOWN || scrollTop === 0,
-        IS_HEADER_STICKY: scrollDirection === SCROLL_DIRECTION.UP && scrollTop !== 0 && (scrollTop >= headerHeight || prevStickyLogic.IS_HEADER_STICKY),
-        IS_FOOTER_HIDDEN: !withFixedFooter && (scrollDirection === SCROLL_DIRECTION.UP || scrollHeight === Math.round(scrollTop)),
-        IS_FOOTER_STICKY: withFixedFooter && scrollHeight > 1 || scrollDirection === SCROLL_DIRECTION.DOWN && (scrollHeight - Math.round(scrollTop) >= footerHeight || prevStickyLogic.IS_FOOTER_STICKY)
-      }));
-    }
-  }, [scrollTop, scrollHeight, isMobile, withMobileLogic, scrollDirection, modalsLogicProps, modalHeight, window.innerHeight]);
-  (0, _react.useLayoutEffect)(() => {
-    var _modalMobileHeaderRef;
-    if ((modalMobileHeaderRef === null || modalMobileHeaderRef === void 0 || (_modalMobileHeaderRef = modalMobileHeaderRef.current) === null || _modalMobileHeaderRef === void 0 || (_modalMobileHeaderRef = _modalMobileHeaderRef.getBoundingClientRect()) === null || _modalMobileHeaderRef === void 0 ? void 0 : _modalMobileHeaderRef.height) !== undefined) {
-      setModalsLogicProps(state => {
-        var _modalMobileHeaderRef2;
-        return {
-          ...state,
-          headerHeight: modalMobileHeaderRef === null || modalMobileHeaderRef === void 0 || (_modalMobileHeaderRef2 = modalMobileHeaderRef.current) === null || _modalMobileHeaderRef2 === void 0 || (_modalMobileHeaderRef2 = _modalMobileHeaderRef2.getBoundingClientRect()) === null || _modalMobileHeaderRef2 === void 0 ? void 0 : _modalMobileHeaderRef2.height
-        };
-      });
-    }
-  }, [modalMobileHeaderRef === null || modalMobileHeaderRef === void 0 || (_modalMobileHeaderRef3 = modalMobileHeaderRef.current) === null || _modalMobileHeaderRef3 === void 0 || (_modalMobileHeaderRef3 = _modalMobileHeaderRef3.getBoundingClientRect()) === null || _modalMobileHeaderRef3 === void 0 ? void 0 : _modalMobileHeaderRef3.height]);
-  (0, _react.useLayoutEffect)(() => {
-    var _modalMobileFooterRef;
-    if ((modalMobileFooterRef === null || modalMobileFooterRef === void 0 || (_modalMobileFooterRef = modalMobileFooterRef.current) === null || _modalMobileFooterRef === void 0 || (_modalMobileFooterRef = _modalMobileFooterRef.getBoundingClientRect()) === null || _modalMobileFooterRef === void 0 ? void 0 : _modalMobileFooterRef.height) !== undefined) {
-      setModalsLogicProps(state => {
-        var _modalMobileFooterRef2;
-        return {
-          ...state,
-          footerHeight: modalMobileFooterRef === null || modalMobileFooterRef === void 0 || (_modalMobileFooterRef2 = modalMobileFooterRef.current) === null || _modalMobileFooterRef2 === void 0 || (_modalMobileFooterRef2 = _modalMobileFooterRef2.getBoundingClientRect()) === null || _modalMobileFooterRef2 === void 0 ? void 0 : _modalMobileFooterRef2.height
-        };
-      });
-    }
-  }, [modalMobileFooterRef === null || modalMobileFooterRef === void 0 || (_modalMobileFooterRef3 = modalMobileFooterRef.current) === null || _modalMobileFooterRef3 === void 0 || (_modalMobileFooterRef3 = _modalMobileFooterRef3.getBoundingClientRect()) === null || _modalMobileFooterRef3 === void 0 ? void 0 : _modalMobileFooterRef3.height]);
-  (0, _react.useEffect)(() => {
-    if (modalMobileContainerRef !== null && modalMobileContainerRef !== void 0 && modalMobileContainerRef.current) {
-      var _modalMobileContainer3, _modalMobileContainer4;
-      // eslint-disable-next-line no-unsafe-optional-chaining
-      setContainerScrollHeight(modalMobileContainerRef === null || modalMobileContainerRef === void 0 || (_modalMobileContainer3 = modalMobileContainerRef.current) === null || _modalMobileContainer3 === void 0 ? void 0 : _modalMobileContainer3.scrollHeight);
-      setScrollHeight((modalMobileContainerRef === null || modalMobileContainerRef === void 0 || (_modalMobileContainer4 = modalMobileContainerRef.current) === null || _modalMobileContainer4 === void 0 ? void 0 : _modalMobileContainer4.scrollHeight) - window.innerHeight);
-    }
-  }, [scrollTop, modalMobileContainerRef === null || modalMobileContainerRef === void 0 ? void 0 : modalMobileContainerRef.current, window.innerHeight]);
-  (0, _react.useEffect)(() => {
-    window.addEventListener("resize", () => {
-      setContainerScrollHeight(containerScrollHeight => {
-        setScrollHeight(containerScrollHeight - window.innerHeight);
-        return containerScrollHeight;
-      });
-    });
-  }, []);
-  /* MODALS LOGIC | END */
-
-  const renderMobileModal = modal => {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "modal-mobile-container",
-      ref: modalMobileContainerRef
-    }, modal);
-  };
-  const renderModal = modal => {
-    return isMobile && withMobileLogic ? renderMobileModal(modal) : modal;
-  };
-  return {
-    modalMobileContainerRef,
-    modalMobileHeaderRef,
-    modalMobileBodyRef,
-    modalMobileFooterRef,
-    MODALS_LOGIC: modalsLogic,
-    SCROLL_DIRECTION,
-    scrollTop,
-    scrollHeight,
-    renderModal,
-    isMobile
-  };
-}