@zohodesk/components 1.0.0-temp-242 → 1.0.0-temp-243

package/lib/Popup/PositionMapping.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.rtlFixedPositionMapping = exports.rtlAbsolutePositionMapping = exports.absolutePositionMapping = void 0;
+var absolutePositionMapping = {
+  "bottomCenter": "bottomCenter",
+  "bottomRight": "bottomLeftToRight",
+  "bottomLeft": "bottomRightToLeft",
+  "topCenter": "topCenter",
+  "topRight": "topLeftToRight",
+  "topLeft": "topRightToLeft",
+  "rightCenter": "rightCenter",
+  "rightBottom": "rightTopToBottom",
+  "rightTop": "rightBottomToTop",
+  "leftCenter": "leftCenter",
+  "leftBottom": "leftTopToBottom",
+  "leftTop": "leftBottomToTop",
+  "bottomLeftToRight": "bottomLeftToRight",
+  "bottomRightToLeft": "bottomRightToLeft",
+  "topLeftToRight": "topLeftToRight",
+  "topRightToLeft": "topRightToLeft",
+  "rightTopToBottom": "rightTopToBottom",
+  "rightBottomToTop": "rightBottomToTop",
+  "leftTopToBottom": "leftTopToBottom"
+};
+exports.absolutePositionMapping = absolutePositionMapping;
+var rtlAbsolutePositionMapping = {
+  "bottomCenter": "bottomCenter",
+  "bottomRight": "bottomRightToLeft",
+  "bottomLeft": "bottomLeftToRight",
+  "topCenter": "topCenter",
+  "topRight": "topRightToLeft",
+  "topLeft": "topLeftToRight",
+  "rightCenter": "leftCenter",
+  "rightBottom": "leftTopToBottom",
+  "rightTop": "leftBottomToTop",
+  "leftCenter": "rightCenter",
+  "leftBottom": "rightTopToBottom",
+  "leftTop": "rightBottomToTop",
+  "bottomLeftToRight": "bottomLeftToRight",
+  "bottomRightToLeft": "bottomRightToLeft",
+  "topLeftToRight": "topLeftToRight",
+  "topRightToLeft": "topRightToLeft",
+  "rightTopToBottom": "rightTopToBottom",
+  "rightBottomToTop": "rightBottomToTop",
+  "leftTopToBottom": "leftTopToBottom"
+};
+exports.rtlAbsolutePositionMapping = rtlAbsolutePositionMapping;
+var rtlFixedPositionMapping = {
+  "bottomCenter": "bottomCenter",
+  "bottomLeftToRight": "bottomRightToLeft",
+  "bottomCenterToRight": "bottomCenterToLeft",
+  "bottomRightToLeft": "bottomLeftToRight",
+  "bottomCenterToLeft": "bottomCenterToRight",
+  "topCenter": "topCenter",
+  "topLeftToRight": "topRightToLeft",
+  "topCenterToRight": "topCenterToLeft",
+  "topRightToLeft": "topLeftToRight",
+  "topCenterToLeft": "topCenterToRight",
+  "rightTopToBottom": "leftTopToBottom",
+  "rightCenterToBottom": "leftCenterToBottom",
+  "rightCenter": "leftCenter",
+  "rightBottomToTop": "leftBottomToTop",
+  "rightCenterToTop": "leftCenterToTop",
+  "leftTopToBottom": "rightTopToBottom",
+  "leftCenterToBottom": "rightCenterToBottom",
+  "leftCenter": "rightCenter",
+  "leftBottomToTop": "rightBottomToTop",
+  "leftCenterToTop": "rightCenterToTop",
+  "bottomRight": "bottomLeft",
+  "bottomLeft": "bottomRight",
+  "topRight": "topLeft",
+  "topLeft": "topRight",
+  "rightBottom": "leftBottom",
+  "rightTop": "leftTop",
+  "leftBottom": "rightBottom",
+  "leftTop": "rightTop"
+};
+exports.rtlFixedPositionMapping = rtlFixedPositionMapping;

package/lib/Popup/Registry.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _Config = require("../Provider/Config.js");
+
+var Registry = {
+  lastOpenedGroup: [],
+  popups: {},
+  listenerPopupRef: undefined,
+  scrollBlockedListenerPopupRef: undefined,
+  scrollableListenerPopupRef: undefined,
+  getOpenedPopups: function getOpenedPopups() {
+    return Object.values(Registry.popups).flat().filter(function (popup) {
+      return popup.state.isPopupOpen;
+    });
+  },
+  getOpenedScrollBlockedFixedPopups: function getOpenedScrollBlockedFixedPopups() {
+    return Registry.getOpenedPopups().filter(function (popup) {
+      return popup.getIsOutsideScrollBlocked(popup) && !popup.getIsAbsolutePopup(popup);
+    });
+  },
+  getOpenedScrollableFixedPopups: function getOpenedScrollableFixedPopups() {
+    return Registry.getOpenedPopups().filter(function (popup) {
+      return !popup.getIsOutsideScrollBlocked(popup) && !popup.getIsAbsolutePopup(popup);
+    });
+  },
+  getRootElement: function getRootElement() {
+    var getRootElement = (0, _Config.getLibraryConfig)('getRootElement');
+
+    if (getRootElement && typeof getRootElement === 'function') {
+      var parent = getRootElement();
+
+      if (parent) {
+        return parent;
+      }
+    }
+
+    return document;
+  }
+};
+var _default = Registry;
+exports["default"] = _default;

package/lib/Popup/intersectionObserver.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addIntersectionObserver = addIntersectionObserver;
+exports.removeIntersectionObserver = removeIntersectionObserver;
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+var observerCallbacks = null;
+var intersectionObserver = null;
+
+function handleObserverCallbacks(entries) {
+  entries.forEach(function (entry) {
+    var oldCallbacks = observerCallbacks.get(entry.target);
+
+    if (Array.isArray(oldCallbacks) && oldCallbacks.length) {
+      oldCallbacks.forEach(function (callback) {
+        callback && callback(entry);
+      });
+    }
+  });
+}
+
+function addIntersectionObserver(element, callback, options) {
+  if (!!element && typeof callback == 'function') {
+    if (intersectionObserver === null && observerCallbacks === null) {
+      intersectionObserver = new IntersectionObserver(function (entries) {
+        handleObserverCallbacks(entries);
+      }, options);
+      observerCallbacks = new Map();
+    }
+
+    intersectionObserver.observe(element);
+    var oldCallbacks = observerCallbacks.get(element) || [];
+    observerCallbacks.set(element, [].concat(_toConsumableArray(oldCallbacks), [callback]));
+  }
+}
+
+function removeIntersectionObserver(element, callback) {
+  if (!!element && typeof callback == 'function') {
+    var oldCallbacks = observerCallbacks ? observerCallbacks.get(element) : null;
+
+    if (Array.isArray(oldCallbacks)) {
+      var callbacks = oldCallbacks.filter(function (handler) {
+        return handler !== callback;
+      });
+
+      if (intersectionObserver && callbacks.length === 0) {
+        observerCallbacks["delete"](element);
+        intersectionObserver.unobserve(element);
+      }
+    }
+
+    if (intersectionObserver && observerCallbacks && observerCallbacks.size === 0) {
+      intersectionObserver.disconnect();
+      intersectionObserver = null;
+      observerCallbacks = null;
+    }
+  }
+}

package/lib/Popup/viewPort.js

@@ -0,0 +1,367 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var defaultOrder = ['bottomCenter', 'bottomLeftToRight', 'bottomCenterToRight', 'bottomRightToLeft', 'bottomCenterToLeft', 'topCenter', 'topLeftToRight', 'topCenterToRight', 'topRightToLeft', 'topCenterToLeft', 'rightTopToBottom', 'rightCenterToBottom', 'rightCenter', 'rightBottomToTop', 'rightCenterToTop', 'leftTopToBottom', 'leftCenterToBottom', 'leftCenter', 'leftBottomToTop', 'leftCenterToTop', 'bottomRight', 'bottomLeft', 'topRight', 'topLeft', 'rightBottom', 'rightTop', 'leftBottom', 'leftTop'];
+var viewPort = {
+  frameRelativeRects: function frameRelativeRects(el, customFrame, documentEle) {
+    if (!el) {
+      return;
+    }
+
+    var rectTemp = el.getBoundingClientRect();
+    var rect = {
+      height: rectTemp.height || el.clientHeight,
+      width: rectTemp.width || el.clientWidth,
+      top: rectTemp.top,
+      bottom: rectTemp.bottom,
+      left: rectTemp.left,
+      right: rectTemp.right,
+      x: rectTemp.x,
+      y: rectTemp.y
+    };
+    documentEle = documentEle ? documentEle : document.documentElement;
+    var customFrameRect = {
+      top: 0,
+      left: 0,
+      right: documentEle.clientWidth,
+      bottom: documentEle.clientHeight,
+      height: documentEle.clientHeight,
+      width: documentEle.clientWidth,
+      x: 0,
+      y: 0
+    };
+
+    if (customFrame) {
+      customFrameRect = customFrame.getBoundingClientRect();
+    }
+
+    var newRect = {
+      top: rect.top - customFrameRect.top,
+      left: rect.left - customFrameRect.left,
+      height: rect.height,
+      width: rect.width
+    };
+    newRect.bottom = newRect.top + newRect.height;
+    newRect.right = newRect.left + newRect.width;
+    newRect.x = newRect.left;
+    newRect.y = newRect.top;
+    var rectGap = {
+      top: newRect.top,
+      left: newRect.left,
+      bottom: customFrameRect.height - newRect.bottom,
+      right: customFrameRect.width - newRect.right
+    };
+    rectGap.center = {
+      top: rectGap.top + newRect.height / 2,
+      left: rectGap.left + newRect.width / 2,
+      bottom: rectGap.bottom + newRect.height / 2,
+      right: rectGap.right + newRect.width / 2
+    };
+    return {
+      frameRect: customFrameRect,
+      rect: newRect,
+      rectGap: rectGap
+    };
+  },
+  isInViewPort: function isInViewPort(el, customFrame) {
+    if (!el) {
+      return;
+    }
+
+    var elRects = viewPort.frameRelativeRects(el, customFrame);
+    var rect = elRects.rect;
+    var frameRect = elRects.frameRect;
+    return rect.top >= 0 && rect.left >= 0 && rect.bottom <= frameRect.height && rect.right <= frameRect.width;
+  },
+  getViewPortEle: function getViewPortEle(el) {
+    return el.closest('[data-viewport-container=true]') ? el.closest('[data-viewport-container=true]') : document.documentElement;
+  },
+  possibilities: function possibilities(el, relativeBox, customFrame) {
+    var _ref = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {},
+        needArrow = _ref.needArrow,
+        isAbsolute = _ref.isAbsolute;
+
+    if (!el) {
+      return;
+    }
+
+    var elViewPortEle = viewPort.getViewPortEle(el);
+    var elRects = viewPort.frameRelativeRects(el, customFrame, elViewPortEle);
+    var rect = elRects.rect;
+    var relativeBoxViewPortEle = viewPort.getViewPortEle(relativeBox);
+    var relativeBoxRects = viewPort.frameRelativeRects(relativeBox, customFrame, relativeBoxViewPortEle);
+    var relativeBoxGap = relativeBoxRects.rectGap,
+        relativeBoxRect = relativeBoxRects.rect;
+    var relativeBoxDocumentRects = viewPort.frameRelativeRects(relativeBox, customFrame);
+    var documentGap = relativeBoxDocumentRects.rectGap; //rect => PopOverContainer, relativeBoxGap => PopOverTarget
+    //Horizontal ~ ----- X axis
+    //Vertical ~ ||||||| Y axis
+
+    var paddingSpace = 5; // space between target and relative element
+
+    var arrowSize = needArrow ? 10 : 0;
+    var padding = needArrow ? arrowSize : paddingSpace;
+    var arrowHorizontalBalancePx = !isAbsolute && needArrow ? 30 : 0;
+    var arrowVerticalBalancePx = !isAbsolute && needArrow ? 27 : 0;
+    var bottomOverFlow = rect.height + padding > relativeBoxGap.bottom;
+    var topOverFlow = rect.height + padding > relativeBoxGap.top;
+    var rightOverFlow = rect.width + padding > relativeBoxGap.right;
+    var leftOverFlow = rect.width + padding > relativeBoxGap.left;
+    var horizontalCenterOverFlow = rect.width / 2 + padding > relativeBoxGap.center.right || rect.width / 2 + padding > relativeBoxGap.center.left;
+    var verticalCenterOverFlow = rect.height / 2 + padding > relativeBoxGap.center.top || rect.height / 2 + padding > relativeBoxGap.center.bottom;
+    var horizontalLeftToRightOverFlow = rect.width + padding > relativeBoxRect.width + relativeBoxGap.right;
+    var horizontalCenterToRightOverFlow = rect.width + padding > relativeBoxGap.center.right || arrowHorizontalBalancePx > relativeBoxGap.center.left;
+    var horizontalRightToLeft = rect.width + padding > relativeBoxRect.width + relativeBoxGap.left;
+    var horizontalCenterToLeft = rect.width + padding > relativeBoxGap.center.left || arrowHorizontalBalancePx > relativeBoxGap.center.right;
+    var verticalTopToBottomOverFlow = rect.height + padding > relativeBoxRect.height + relativeBoxGap.bottom;
+    var verticalCenterToBottomOverFlow = rect.height + padding > relativeBoxGap.center.bottom || arrowVerticalBalancePx > relativeBoxGap.center.top;
+    var verticalBottomToTopOverFlow = rect.height + padding > relativeBoxRect.height + relativeBoxGap.top;
+    var verticalCenterToTopOverFlow = rect.height + padding > relativeBoxGap.center.top || arrowVerticalBalancePx > relativeBoxGap.center.bottom;
+    var views = {
+      bottomCenter: !(bottomOverFlow || horizontalCenterOverFlow),
+      bottomLeftToRight: !(bottomOverFlow || horizontalLeftToRightOverFlow),
+      bottomCenterToRight: !(bottomOverFlow || horizontalCenterToRightOverFlow),
+      bottomRight: !(bottomOverFlow || rightOverFlow || arrowHorizontalBalancePx > relativeBoxRect.right),
+      bottomRightToLeft: !(bottomOverFlow || horizontalRightToLeft),
+      bottomCenterToLeft: !(bottomOverFlow || horizontalCenterToLeft),
+      bottomLeft: !(bottomOverFlow || leftOverFlow || arrowHorizontalBalancePx > relativeBoxGap.right + relativeBoxRect.width),
+      topCenter: !(topOverFlow || horizontalCenterOverFlow),
+      topLeftToRight: !(topOverFlow || horizontalLeftToRightOverFlow),
+      topCenterToRight: !(topOverFlow || horizontalCenterToRightOverFlow),
+      topRight: !(topOverFlow || rightOverFlow || arrowHorizontalBalancePx > relativeBoxRect.right),
+      topRightToLeft: !(topOverFlow || horizontalRightToLeft),
+      topCenterToLeft: !(topOverFlow || horizontalCenterToLeft),
+      topLeft: !(topOverFlow || leftOverFlow || arrowHorizontalBalancePx > relativeBoxGap.right + relativeBoxRect.width),
+      rightCenter: !(rightOverFlow || verticalCenterOverFlow),
+      rightTopToBottom: !(rightOverFlow || verticalTopToBottomOverFlow),
+      rightCenterToBottom: !(rightOverFlow || verticalCenterToBottomOverFlow),
+      rightBottom: !(rightOverFlow || bottomOverFlow || arrowVerticalBalancePx > relativeBoxRect.bottom),
+      rightBottomToTop: !(rightOverFlow || verticalBottomToTopOverFlow),
+      rightCenterToTop: !(rightOverFlow || verticalCenterToTopOverFlow),
+      rightTop: !(rightOverFlow || topOverFlow || arrowVerticalBalancePx > relativeBoxGap.bottom + relativeBoxRect.height),
+      leftCenter: !(leftOverFlow || verticalCenterOverFlow),
+      leftTopToBottom: !(leftOverFlow || verticalTopToBottomOverFlow),
+      leftCenterToBottom: !(leftOverFlow || verticalCenterToBottomOverFlow),
+      leftBottom: !(leftOverFlow || bottomOverFlow || arrowVerticalBalancePx > relativeBoxRect.bottom),
+      leftBottomToTop: !(leftOverFlow || verticalBottomToTopOverFlow),
+      leftCenterToTop: !(leftOverFlow || verticalCenterToTopOverFlow),
+      leftTop: !(leftOverFlow || topOverFlow || arrowVerticalBalancePx > relativeBoxGap.bottom + relativeBoxRect.height)
+    };
+    var horizontalCenter = relativeBoxGap.left + relativeBoxRect.width / 2;
+    var horizontalLeft = relativeBoxGap.left;
+    var horizontalRight = relativeBoxGap.left + relativeBoxRect.width;
+    var verticalBottom = relativeBoxGap.top + relativeBoxRect.height;
+    var verticalTop = relativeBoxGap.top;
+    var verticalCenter = relativeBoxGap.top + relativeBoxRect.height / 2;
+    var horizontalTop = documentGap.bottom + relativeBoxRect.height;
+    var verticalCenterToTop = documentGap.bottom + relativeBoxRect.height / 2;
+    var viewsOffset = {
+      bottomCenter: {
+        left: horizontalCenter - rect.width / 2,
+        top: verticalBottom + arrowSize
+      },
+      bottomLeftToRight: {
+        left: horizontalLeft,
+        top: verticalBottom + arrowSize
+      },
+      bottomCenterToRight: {
+        left: horizontalCenter - arrowHorizontalBalancePx,
+        top: verticalBottom + arrowSize
+      },
+      bottomRight: {
+        left: horizontalRight - arrowHorizontalBalancePx,
+        top: verticalBottom + arrowSize
+      },
+      bottomRightToLeft: {
+        left: horizontalRight - rect.width,
+        top: verticalBottom + arrowSize
+      },
+      bottomCenterToLeft: {
+        left: horizontalCenter - rect.width + arrowHorizontalBalancePx,
+        top: verticalBottom + arrowSize
+      },
+      bottomLeft: {
+        left: horizontalLeft - rect.width + arrowHorizontalBalancePx,
+        top: verticalBottom + arrowSize
+      },
+      topCenter: {
+        left: horizontalCenter - rect.width / 2,
+        bottom: horizontalTop + arrowSize
+      },
+      topLeftToRight: {
+        left: horizontalLeft,
+        bottom: horizontalTop + arrowSize
+      },
+      topCenterToRight: {
+        left: horizontalCenter - arrowHorizontalBalancePx,
+        bottom: horizontalTop + arrowSize
+      },
+      topRight: {
+        left: horizontalRight - arrowHorizontalBalancePx,
+        bottom: horizontalTop + arrowSize
+      },
+      topRightToLeft: {
+        left: horizontalRight - rect.width,
+        bottom: horizontalTop + arrowSize
+      },
+      topCenterToLeft: {
+        left: horizontalCenter - rect.width + arrowHorizontalBalancePx,
+        bottom: horizontalTop + arrowSize
+      },
+      topLeft: {
+        left: horizontalLeft - rect.width + arrowHorizontalBalancePx,
+        top: verticalTop - (rect.height + arrowSize)
+      },
+      rightCenter: {
+        left: horizontalRight + arrowSize,
+        top: verticalCenter - rect.height / 2
+      },
+      rightTopToBottom: {
+        left: horizontalRight + arrowSize,
+        top: verticalTop
+      },
+      rightCenterToBottom: {
+        left: horizontalRight + arrowSize,
+        top: verticalCenter - arrowVerticalBalancePx
+      },
+      rightBottom: {
+        left: horizontalRight + arrowSize,
+        top: verticalBottom - arrowVerticalBalancePx
+      },
+      rightBottomToTop: {
+        left: horizontalRight + arrowSize,
+        bottom: documentGap.bottom
+      },
+      rightCenterToTop: {
+        left: horizontalRight + arrowSize,
+        bottom: verticalCenterToTop - arrowVerticalBalancePx
+      },
+      rightTop: {
+        left: horizontalRight + arrowSize,
+        bottom: horizontalTop - arrowVerticalBalancePx
+      },
+      leftCenter: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        top: verticalCenter - rect.height / 2
+      },
+      leftTopToBottom: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        top: verticalTop
+      },
+      leftCenterToBottom: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        top: verticalCenter - arrowVerticalBalancePx
+      },
+      leftBottom: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        top: verticalBottom - arrowVerticalBalancePx
+      },
+      leftBottomToTop: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        bottom: documentGap.bottom
+      },
+      leftCenterToTop: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        bottom: verticalCenterToTop - arrowVerticalBalancePx
+      },
+      leftTop: {
+        left: horizontalLeft - (rect.width + arrowSize),
+        bottom: horizontalTop - arrowVerticalBalancePx
+      }
+    };
+    return {
+      views: views,
+      viewsOffset: viewsOffset,
+      targetOffset: relativeBoxRect,
+      popupOffset: rect
+    };
+  },
+  getArrowAdjustments: function getArrowAdjustments(el, relativeBox, customFrame) {
+    if (!el) {
+      return;
+    }
+
+    var elRects = viewPort.frameRelativeRects(el, customFrame);
+    var rectGap = elRects.rectGap;
+    var relativeBoxRects = viewPort.frameRelativeRects(relativeBox, customFrame);
+    var relativeBoxGap = relativeBoxRects.rectGap;
+    return {
+      left: relativeBoxGap.center.left - rectGap.left,
+      right: relativeBoxGap.center.right - rectGap.right,
+      top: relativeBoxGap.center.top - rectGap.top,
+      bottom: relativeBoxGap.center.bottom - rectGap.bottom
+    };
+  },
+  betterView: function betterView(popup, relativeBox) {
+    var defaultView = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
+    var customFrame = arguments.length > 3 ? arguments[3] : undefined;
+
+    var _ref2 = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {},
+        needArrow = _ref2.needArrow,
+        isAbsolute = _ref2.isAbsolute,
+        _ref2$customOrder = _ref2.customOrder,
+        customOrder = _ref2$customOrder === void 0 ? [] : _ref2$customOrder;
+
+    var customScrollFrame = isAbsolute ? customFrame : '';
+    var viewPortPossibilities = viewPort.possibilities(popup, relativeBox, customScrollFrame, {
+      needArrow: needArrow,
+      isAbsolute: isAbsolute
+    });
+
+    if (!viewPortPossibilities) {
+      return;
+    }
+
+    var views = viewPortPossibilities.views,
+        viewsOffset = viewPortPossibilities.viewsOffset,
+        targetOffset = viewPortPossibilities.targetOffset,
+        popupOffset = viewPortPossibilities.popupOffset;
+    var view = null;
+    var isViewFound = false;
+
+    if (!isViewFound && defaultView && views[defaultView]) {
+      view = defaultView;
+      isViewFound = true;
+    }
+
+    if (!isViewFound) {
+      if (customOrder.length > 0) {
+        isViewFound = customOrder.some(function (position) {
+          if (views[position]) {
+            view = position;
+            return true;
+          }
+        });
+      } else {
+        isViewFound = defaultOrder.some(function (position) {
+          if (views[position]) {
+            view = position;
+            return true;
+          }
+        });
+      }
+    }
+
+    if (!isViewFound) {
+      view = defaultView;
+    }
+
+    return {
+      view: view,
+      views: views,
+      viewsOffset: viewsOffset,
+      targetOffset: targetOffset,
+      popupOffset: popupOffset
+    };
+  }
+};
+var _default = {
+  betterView: viewPort.betterView,
+  frameRelativeRects: viewPort.frameRelativeRects,
+  getArrowAdjustments: viewPort.getArrowAdjustments,
+  isInViewPort: viewPort.isInViewPort
+};
+exports["default"] = _default;

package/lib/utils/Common.js

@@ -38,7 +38,7 @@ exports.stopAllEventPropagation = exports.scrollTo = void 0;
 exports.stopPropagation = stopPropagation;
 exports.throttle = void 0;
 
-var _viewPort = _interopRequireDefault(require("@zohodesk/dotkit/es/react/components/Popup/utils/viewPort.js"));
+var _viewPort = _interopRequireDefault(require("../Popup/viewPort"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 

package/lib/v1/Popup/Popup.js

@@ -15,7 +15,7 @@ var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-stat
 
 var _Common = require("../../utils/Common.js");
 
-var _viewPort = _interopRequireDefault(require("@zohodesk/dotkit/es/react/components/Popup/utils/viewPort.js"));
+var _viewPort = _interopRequireDefault(require("../../Popup/viewPort"));
 
 var _PositionMapping = require("../../Popup/PositionMapping.js");
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-temp-242",
+  "version": "1.0.0-temp-243",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -39,7 +39,7 @@
     "build:css:umd": "npm run clean &&  npm run init && react-cli build:css:umd",
     "coverage": "react-cli coverage",
     "prepare": "npm run init &&  npm run css:build ",
-    "prepublishOnly": "node prePublish.js && npm run css:review && npm run review:props ",
+    "prepublishOnly": "node prePublish.js && npm run download_only",
     "postpublish": "node postPublish.js",
     "report": "react-cli publish:report",
     "test": "react-cli test",
@@ -74,13 +74,13 @@
     "@testing-library/react": "^11.2.5",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^13.0.10",
-    "@zohodesk-private/color-variable-preprocessor": "1.2.0",
+    "@zohodesk-private/color-variable-preprocessor": "1.0.0-temp-14.1",
     "@zohodesk-private/css-variable-migrator": "1.0.9",
     "@zohodesk-private/node-plugins": "1.1.13",
     "@zohodesk-private/react-prop-validator": "1.2.3",
     "@zohodesk/a11y": "2.3.8",
     "@zohodesk/docstool": "1.0.0-alpha-2",
-    "@zohodesk/dotkit": "1.0.0-temp-2",
+    "@zohodesk/dotkit": "1.0.3",
     "@zohodesk/hooks": "2.0.6",
     "@zohodesk/icons": "1.1.3",
     "@zohodesk/layout": "3.1.0",
@@ -109,6 +109,6 @@
     "@zohodesk/utils": "1.3.15",
     "@zohodesk/a11y": "2.3.8",
     "@zohodesk/layout": "3.1.0",
-    "@zohodesk/dotkit": "1.0.0-temp-2"
+    "@zohodesk/dotkit": "1.0.3"
   }
 }