@zohodesk/components 1.5.3 → 1.5.4-temp-1

package/lib/Tag/Tag.js

@@ -13,6 +13,8 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
+var _utils = require("@zohodesk/utils");
+
 var _icons = require("@zohodesk/icons");
 
 var _Avatar = _interopRequireDefault(require("../Avatar/Avatar"));
@@ -141,6 +143,8 @@ var Tag = /*#__PURE__*/function (_PureComponent) {
           a11y = _this$props4.a11y,
           needEffect = _this$props4.needEffect,
           isReadOnly = _this$props4.isReadOnly,
+          renderLeftChildren = _this$props4.renderLeftChildren,
+          renderRightChildren = _this$props4.renderRightChildren,
           customProps = _this$props4.customProps;
       var _customProps$avatarPr = customProps.avatarProps,
           avatarProps = _customProps$avatarPr === void 0 ? {} : _customProps$avatarPr,
@@ -169,7 +173,7 @@ var Tag = /*#__PURE__*/function (_PureComponent) {
         tabIndex: disabled ? '-1' : '0',
         "aria-labelledby": getAriaId,
         "data-selector-id": dataSelectorId
-      }, customAttributes), hasAvatar ? /*#__PURE__*/_react["default"].createElement("div", {
+      }, customAttributes), (0, _utils.renderNode)(renderLeftChildren), hasAvatar ? /*#__PURE__*/_react["default"].createElement("div", {
         className: _TagModule["default"].avatar
       }, /*#__PURE__*/_react["default"].createElement(_Avatar["default"], _extends({
         palette: isDarkPalette ? 'info' : avatarPalette,
@@ -202,7 +206,7 @@ var Tag = /*#__PURE__*/function (_PureComponent) {
         isBold: true,
         name: "ZD-close2",
         size: "8"
-      }))));
+      }))), (0, _utils.renderNode)(renderRightChildren));
     }
   }]);
 

package/lib/Tag/props/propTypes.js

@@ -47,6 +47,8 @@ var propTypes = {
   needEffect: _propTypes["default"].bool,
   isReadOnly: _propTypes["default"].bool,
   dataSelectorId: _propTypes["default"].string,
+  renderLeftChildren: _propTypes["default"].oneOfType([_propTypes["default"].node, _propTypes["default"].func]),
+  renderRightChildren: _propTypes["default"].oneOfType([_propTypes["default"].node, _propTypes["default"].func]),
   customProps: _propTypes["default"].shape({
     avatarProps: _propTypes["default"].exact(_propTypes2.propTypes),
     iconProps: _propTypes["default"].exact(_propTypes3.IconProps)

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("../Popup/viewPort"));
+var _viewPort = _interopRequireDefault(require("@zohodesk/dotkit/es/react/components/Popup/utils/viewPort.js"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 

package/lib/v1/Popup/Popup.js

@@ -15,9 +15,9 @@ var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-stat
 
 var _Common = require("../../utils/Common.js");
 
-var _viewPort = _interopRequireDefault(require("../../Popup/viewPort"));
+var _viewPort = _interopRequireDefault(require("@zohodesk/dotkit/es/react/components/Popup/utils/viewPort.js"));
 
-var _PositionMapping = require("../../Popup/PositionMapping.js");
+var _positioning = require("@zohodesk/dotkit/es/react/components/Popup/utils/positioning.js");
 
 var _ResizeObserver = _interopRequireDefault(require("@zohodesk/virtualizer/lib/commons/ResizeObserver.js"));
 
@@ -484,9 +484,9 @@ var Popup = function Popup(Component) {
         var customOrder = this.getCustomPositionOrder(this);
 
         if (direction === 'rtl') {
-          defaultPosition = isAbsolute ? _PositionMapping.rtlAbsolutePositionMapping[defaultPosition] : _PositionMapping.rtlFixedPositionMapping[defaultPosition];
+          defaultPosition = isAbsolute ? _positioning.rtlAbsolutePositionMapping[defaultPosition] : _positioning.rtlFixedPositionMapping[defaultPosition];
         } else {
-          defaultPosition = isAbsolute ? _PositionMapping.absolutePositionMapping[defaultPosition] : defaultPosition;
+          defaultPosition = isAbsolute ? _positioning.absolutePositionMapping[defaultPosition] : defaultPosition;
         }
 
         if (!placeHolderElement && !dropElement) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.5.3",
+  "version": "1.5.4-temp-1",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,

package/es/DropBox/DropBoxPositionMapping.js

@@ -1,142 +0,0 @@
-export const positionMapping = {
-  "bottomCenter": {
-    "direction": "bottom",
-    "arrowPosition": "mid",
-    "positionStyle": "bottomMid"
-  },
-  "bottomLeftToRight": {
-    "direction": "bottom",
-    "arrowPosition": "start",
-    "positionStyle": "bottomEnd"
-  },
-  "bottomCenterToRight": {
-    "direction": "bottom",
-    "arrowPosition": "start",
-    "positionStyle": "bottomEnd"
-  },
-  "bottomRightToLeft": {
-    "direction": "bottom",
-    "arrowPosition": "end",
-    "positionStyle": "bottomStart"
-  },
-  "bottomCenterToLeft": {
-    "direction": "bottom",
-    "arrowPosition": "end",
-    "positionStyle": "bottomStart"
-  },
-  "topCenter": {
-    "direction": "top",
-    "arrowPosition": "mid",
-    "positionStyle": "topMid"
-  },
-  "topLeftToRight": {
-    "direction": "top",
-    "arrowPosition": "start",
-    "positionStyle": "topEnd"
-  },
-  "topCenterToRight": {
-    "direction": "top",
-    "arrowPosition": "start",
-    "positionStyle": "topEnd"
-  },
-  "topRightToLeft": {
-    "direction": "top",
-    "arrowPosition": "end",
-    "positionStyle": "topStart"
-  },
-  "topCenterToLeft": {
-    "direction": "top",
-    "arrowPosition": "end",
-    "positionStyle": "topStart"
-  },
-  "rightCenter": {
-    "direction": "right",
-    "arrowPosition": "mid",
-    "positionStyle": "rightMid"
-  },
-  "rightTopToBottom": {
-    "direction": "right",
-    "arrowPosition": "start",
-    "positionStyle": "rightEnd"
-  },
-  "rightCenterToBottom": {
-    "direction": "right",
-    "arrowPosition": "start",
-    "positionStyle": "rightEnd"
-  },
-  "rightBottomToTop": {
-    "direction": "right",
-    "arrowPosition": "end",
-    "positionStyle": "rightStart"
-  },
-  "rightCenterToTop": {
-    "direction": "right",
-    "arrowPosition": "end",
-    "positionStyle": "rightStart"
-  },
-  "leftCenter": {
-    "direction": "left",
-    "arrowPosition": "mid",
-    "positionStyle": "leftMid"
-  },
-  "leftTopToBottom": {
-    "direction": "left",
-    "arrowPosition": "start",
-    "positionStyle": "leftEnd"
-  },
-  "leftCenterToBottom": {
-    "direction": "left",
-    "arrowPosition": "start",
-    "positionStyle": "leftEnd"
-  },
-  "leftBottomToTop": {
-    "direction": "left",
-    "arrowPosition": "end",
-    "positionStyle": "leftStart"
-  },
-  "leftCenterToTop": {
-    "direction": "left",
-    "arrowPosition": "end",
-    "positionStyle": "leftStart"
-  },
-  "bottomRight": {
-    "direction": "bottom",
-    "arrowPosition": "start",
-    "positionStyle": "bottomEnd"
-  },
-  "bottomLeft": {
-    "direction": "bottom",
-    "arrowPosition": "end",
-    "positionStyle": "bottomStart"
-  },
-  "topRight": {
-    "direction": "top",
-    "arrowPosition": "start",
-    "positionStyle": "topEnd"
-  },
-  "topLeft": {
-    "direction": "top",
-    "arrowPosition": "end",
-    "positionStyle": "topStart"
-  },
-  "rightBottom": {
-    "direction": "right",
-    "arrowPosition": "start",
-    "positionStyle": "rightEnd"
-  },
-  "rightTop": {
-    "direction": "right",
-    "arrowPosition": "end",
-    "positionStyle": "rightStart"
-  },
-  "leftBottom": {
-    "direction": "left",
-    "arrowPosition": "start",
-    "positionStyle": "leftEnd"
-  },
-  "leftTop": {
-    "direction": "left",
-    "arrowPosition": "end",
-    "positionStyle": "leftStart"
-  }
-};

package/es/Popup/PositionMapping.js

@@ -1,72 +0,0 @@
-export const 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"
-};
-export const 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"
-};
-export const 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"
-};

package/es/Popup/Registry.js

@@ -1,36 +0,0 @@
-import { getLibraryConfig } from "../Provider/Config.js";
-const Registry = {
-  lastOpenedGroup: [],
-  popups: {},
-  listenerPopupRef: undefined,
-  scrollBlockedListenerPopupRef: undefined,
-  scrollableListenerPopupRef: undefined,
-
-  getOpenedPopups() {
-    return Object.values(Registry.popups).flat().filter(popup => popup.state.isPopupOpen);
-  },
-
-  getOpenedScrollBlockedFixedPopups() {
-    return Registry.getOpenedPopups().filter(popup => popup.getIsOutsideScrollBlocked(popup) && !popup.getIsAbsolutePopup(popup));
-  },
-
-  getOpenedScrollableFixedPopups() {
-    return Registry.getOpenedPopups().filter(popup => !popup.getIsOutsideScrollBlocked(popup) && !popup.getIsAbsolutePopup(popup));
-  },
-
-  getRootElement() {
-    const getRootElement = getLibraryConfig('getRootElement');
-
-    if (getRootElement && typeof getRootElement === 'function') {
-      const parent = getRootElement();
-
-      if (parent) {
-        return parent;
-      }
-    }
-
-    return document;
-  }
-
-};
-export default Registry;

package/es/Popup/intersectionObserver.js

@@ -1,49 +0,0 @@
-let observerCallbacks = null;
-let intersectionObserver = null;
-
-function handleObserverCallbacks(entries) {
-  entries.forEach(entry => {
-    let oldCallbacks = observerCallbacks.get(entry.target);
-
-    if (Array.isArray(oldCallbacks) && oldCallbacks.length) {
-      oldCallbacks.forEach(callback => {
-        callback && callback(entry);
-      });
-    }
-  });
-}
-
-export function addIntersectionObserver(element, callback, options) {
-  if (!!element && typeof callback == 'function') {
-    if (intersectionObserver === null && observerCallbacks === null) {
-      intersectionObserver = new IntersectionObserver(entries => {
-        handleObserverCallbacks(entries);
-      }, options);
-      observerCallbacks = new Map();
-    }
-
-    intersectionObserver.observe(element);
-    let oldCallbacks = observerCallbacks.get(element) || [];
-    observerCallbacks.set(element, [...oldCallbacks, callback]);
-  }
-}
-export function removeIntersectionObserver(element, callback) {
-  if (!!element && typeof callback == 'function') {
-    let oldCallbacks = observerCallbacks ? observerCallbacks.get(element) : null;
-
-    if (Array.isArray(oldCallbacks)) {
-      let callbacks = oldCallbacks.filter(handler => 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;
-    }
-  }
-}