@zohodesk/components 1.0.0-temp-210.1 → 1.0.0-temp-199.2

package/lib/Select/GroupSelect.js

@@ -51,6 +51,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -664,7 +666,10 @@ var GroupSelectComponent = /*#__PURE__*/function (_PureComponent) {
           htmlId = _this$props9.htmlId,
           iconOnHover = _this$props9.iconOnHover,
           isLoading = _this$props9.isLoading,
-          dataSelectorId = _this$props9.dataSelectorId;
+          dataSelectorId = _this$props9.dataSelectorId,
+          customProps = _this$props9.customProps;
+      var _customProps$suggesti = customProps.suggestionsProps,
+          suggestionsProps = _customProps$suggesti === void 0 ? {} : _customProps$suggesti;
       i18nKeys = Object.assign({}, i18nKeys, {
         emptyText: i18nKeys.emptyText || emptyMessage,
         searchEmptyText: i18nKeys.searchEmptyText || searchEmptyMessage
@@ -837,7 +842,7 @@ var GroupSelectComponent = /*#__PURE__*/function (_PureComponent) {
             a11y: {
               role: 'heading'
             }
-          })), /*#__PURE__*/_react["default"].createElement(_Suggestions["default"], {
+          })), /*#__PURE__*/_react["default"].createElement(_Suggestions["default"], _extends({
             activeId: selectedId,
             suggestions: options,
             getRef: _this7.suggestionItemRef,
@@ -853,7 +858,7 @@ var GroupSelectComponent = /*#__PURE__*/function (_PureComponent) {
               role: 'option'
             },
             dataId: "".concat(dataId, "_Options")
-          }));
+          }, suggestionsProps)));
         }) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
           options: revampedGroups,
           searchString: searchStr,

package/lib/Select/SelectWithAvatar.js

@@ -51,6 +51,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -213,7 +215,10 @@ var SelectWithAvatarComponent = /*#__PURE__*/function (_SelectComponent) {
           needEffect = _this$props.needEffect,
           isLoading = _this$props.isLoading,
           dataSelectorId = _this$props.dataSelectorId,
-          getTargetRef = _this$props.getTargetRef;
+          getTargetRef = _this$props.getTargetRef,
+          customProps = _this$props.customProps;
+      var _customProps$suggesti = customProps.suggestionsProps,
+          suggestionsProps = _customProps$suggesti === void 0 ? {} : _customProps$suggesti;
       i18nKeys = Object.assign({}, i18nKeys, {
         emptyText: i18nKeys.emptyText || emptyMessage,
         searchEmptyText: i18nKeys.searchEmptyText || searchEmptyMessage
@@ -352,7 +357,7 @@ var SelectWithAvatarComponent = /*#__PURE__*/function (_SelectComponent) {
           a11y: {
             role: 'heading'
           }
-        })) : null, suggestions.length ? /*#__PURE__*/_react["default"].createElement(_Suggestions["default"], {
+        })) : null, suggestions.length ? /*#__PURE__*/_react["default"].createElement(_Suggestions["default"], _extends({
           dataId: "".concat(dataId, "_Options"),
           activeId: selectedId,
           suggestions: suggestions,
@@ -369,7 +374,7 @@ var SelectWithAvatarComponent = /*#__PURE__*/function (_SelectComponent) {
             ariaParentRole: 'listbox',
             role: 'option'
           }
-        }) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+        }, suggestionsProps)) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
           isLoading: isFetchingOptions,
           options: options,
           searchString: searchStr,

package/lib/Select/SelectWithIcon.js

@@ -440,7 +440,9 @@ var SelectWithIcon = /*#__PURE__*/function (_Component) {
           _customProps$Dropdown = customProps.DropdownSearchTextBoxProps,
           DropdownSearchTextBoxProps = _customProps$Dropdown === void 0 ? {} : _customProps$Dropdown,
           _customProps$TextBoxI = customProps.TextBoxIconProps,
-          TextBoxIconProps = _customProps$TextBoxI === void 0 ? {} : _customProps$TextBoxI;
+          TextBoxIconProps = _customProps$TextBoxI === void 0 ? {} : _customProps$TextBoxI,
+          _customProps$listItem = customProps.listItemProps,
+          listItemProps = _customProps$listItem === void 0 ? {} : _customProps$listItem;
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_SelectModule["default"].container, " ").concat(_SelectModule["default"]["box_".concat(size)], " ").concat(isReadOnly ? _SelectModule["default"].readonly : '', " ").concat(borderColor === 'transparent' ? _SelectModule["default"].transparentContainer : ''),
         "data-title": isDisabled ? title : null,
@@ -573,7 +575,7 @@ var SelectWithIcon = /*#__PURE__*/function (_Component) {
           var iconName = options.iconName,
               iconSize = options.iconSize,
               iconColor = options.iconColor;
-          return /*#__PURE__*/_react["default"].createElement(_ListItemWithIcon["default"], {
+          return /*#__PURE__*/_react["default"].createElement(_ListItemWithIcon["default"], _extends({
             key: options[idKey],
             value: options[valueKey],
             size: "medium",
@@ -597,7 +599,7 @@ var SelectWithIcon = /*#__PURE__*/function (_Component) {
               ariaSelected: selectedId === options[idKey],
               ariaLabel: options[valueKey]
             }
-          });
+          }, listItemProps));
         })) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
           isLoading: isFetchingOptions,
           options: options,

package/lib/Select/props/defaultProps.js

@@ -82,7 +82,8 @@ var GroupSelect_defaultProps = {
   isRestrictScroll: false,
   i18nKeys: {},
   iconOnHover: false,
-  isLoading: false
+  isLoading: false,
+  customProps: {}
 };
 exports.GroupSelect_defaultProps = GroupSelect_defaultProps;
 var SelectWithAvatar_defaultProps = {
@@ -109,7 +110,8 @@ var SelectWithAvatar_defaultProps = {
   isRestrictScroll: false,
   i18nKeys: {},
   needEffect: true,
-  isLoading: false
+  isLoading: false,
+  customProps: {}
 };
 exports.SelectWithAvatar_defaultProps = SelectWithAvatar_defaultProps;
 var SelectWithIcon_defaultProps = (_SelectWithIcon_defau = {

package/lib/Select/props/propTypes.js

@@ -191,7 +191,8 @@ var GroupSelect_propTypes = {
   }),
   isLoading: _propTypes["default"].bool,
   dataSelectorId: _propTypes["default"].string,
-  isDefaultSelectValue: _propTypes["default"].bool
+  isDefaultSelectValue: _propTypes["default"].bool,
+  customProps: _propTypes["default"].string
 };
 exports.GroupSelect_propTypes = GroupSelect_propTypes;
 
@@ -254,7 +255,8 @@ var SelectWithAvatar_propTypes = _objectSpread(_objectSpread({}, Select_propType
   htmlId: _propTypes["default"].string,
   needEffect: _propTypes["default"].bool,
   isLoading: _propTypes["default"].bool,
-  dataSelectorId: _propTypes["default"].string
+  dataSelectorId: _propTypes["default"].string,
+  customProps: _propTypes["default"].string
 });
 
 exports.SelectWithAvatar_propTypes = SelectWithAvatar_propTypes;

package/lib/v1/Popup/Popup.js

@@ -9,9 +9,9 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _propTypes = require("../../Popup/props/propTypes.js");
+var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
 
 var _Common = require("../../utils/Common.js");
 
@@ -151,11 +151,6 @@ var Popup = function Popup(Component) {
       _this.handleDocumentMouseDown = _this.handleDocumentMouseDown.bind(_assertThisInitialized(_this));
       _this.handleDocumentFocus = _this.handleDocumentFocus.bind(_assertThisInitialized(_this));
       _this.handleGetNeedPrevent = _this.handleGetNeedPrevent.bind(_assertThisInitialized(_this));
-      _this.handleBlockScroll = _this.handleBlockScroll.bind(_assertThisInitialized(_this));
-      _this.handlePositionChange = _this.handlePositionChange.bind(_assertThisInitialized(_this));
-      _this.preventKeyboardScroll = _this.preventKeyboardScroll.bind(_assertThisInitialized(_this));
-      _this.addScrollBlockListeners = _this.addScrollBlockListeners.bind(_assertThisInitialized(_this));
-      _this.removeScrollBlockListeners = _this.removeScrollBlockListeners.bind(_assertThisInitialized(_this));
       _this.popupObserver = new _ResizeObserver["default"](_this.handlePopupResize); //dropBoxSize
 
       _this.size = null;
@@ -169,7 +164,6 @@ var Popup = function Popup(Component) {
           scrollDebounceTime = _this$getScrollDeboun.scrollDebounceTime;
 
       _this.handleScroll = (0, _Common.debounce)(_this.handleScroll.bind(_assertThisInitialized(_this)), scrollDebounceTime);
-      _this.handleDebouncedPositionChange = (0, _Common.debounce)(_this.handlePositionChange.bind(_assertThisInitialized(_this)), 100);
       return _this;
     }
 
@@ -213,10 +207,7 @@ var Popup = function Popup(Component) {
             oldStateOpen = _ref2$isPopupReady === void 0 ? false : _ref2$isPopupReady;
 
         var dropElement = this.dropElement;
-        var _this$props = this.props,
-            propResizeHandling = _this$props.needResizeHandling,
-            isAbsolutePositioningNeeded = _this$props.isAbsolutePositioningNeeded,
-            isBlockedOutsideScroll = _this$props.isBlockedOutsideScroll;
+        var propResizeHandling = this.props.needResizeHandling;
 
         if (oldStateOpen !== isPopupReady) {
           if (isPopupReady && dropElement && (propResizeHandling !== undefined ? propResizeHandling : needResizeHandling)) {
@@ -225,14 +216,6 @@ var Popup = function Popup(Component) {
             this.size = null;
             this.popupObserver.disconnect();
           }
-
-          if (isBlockedOutsideScroll && !isAbsolutePositioningNeeded) {
-            if (isPopupReady) {
-              this.addScrollBlockListeners();
-            } else {
-              this.removeScrollBlockListeners();
-            }
-          }
         }
       }
     }, {
@@ -253,7 +236,6 @@ var Popup = function Popup(Component) {
 
           return res;
         }, popups);
-        this.removeScrollBlockListeners();
         var noPopups = true;
 
         for (var i in popups) {
@@ -277,81 +259,6 @@ var Popup = function Popup(Component) {
           document.removeEventListener('focus', this.handleDocumentFocus, true);
         }
       }
-    }, {
-      key: "addScrollBlockListeners",
-      value: function addScrollBlockListeners() {
-        document.addEventListener('wheel', this.handleBlockScroll, {
-          capture: true,
-          passive: false
-        });
-        document.addEventListener('touchmove', this.handleBlockScroll, {
-          capture: true,
-          passive: false
-        });
-        document.addEventListener('scroll', this.handleDebouncedPositionChange, {
-          capture: true,
-          passive: false
-        });
-        document.addEventListener('keydown', this.preventKeyboardScroll, {
-          capture: true,
-          passive: false
-        });
-      }
-    }, {
-      key: "removeScrollBlockListeners",
-      value: function removeScrollBlockListeners() {
-        document.removeEventListener('wheel', this.handleBlockScroll, {
-          capture: true,
-          passive: false
-        });
-        document.removeEventListener('touchmove', this.handleBlockScroll, {
-          capture: true,
-          passive: false
-        });
-        document.removeEventListener('scroll', this.handleDebouncedPositionChange, {
-          capture: true,
-          passive: false
-        });
-        document.removeEventListener('keydown', this.preventKeyboardScroll, {
-          capture: true,
-          passive: false
-        });
-      }
-    }, {
-      key: "handleBlockScroll",
-      value: function handleBlockScroll(event) {
-        // const targetElement = this.placeHolderElement;
-        var containerElement = this.dropElement;
-
-        if (containerElement && containerElement !== event.target && !containerElement.contains(event.target)) {
-          // --- Scroll exclude Target & Container elements --- For reference. Will adopt in future
-          // if(
-          //   (containerElement && (containerElement !== event.target && !containerElement.contains(event.target)))
-          //   && (targetElement && (targetElement !== event.target && !targetElement.contains(event.target)))
-          // ) {
-          event.preventDefault();
-        }
-      }
-    }, {
-      key: "handlePositionChange",
-      value: function handlePositionChange(event) {
-        var targetElement = this.placeHolderElement;
-        var containerElement = this.dropElement;
-
-        if (containerElement && containerElement !== event.target && !containerElement.contains(event.target) && targetElement && targetElement !== event.target && !targetElement.contains(event.target) && event.target.contains(targetElement)) {
-          this.handlePopupPosition(this.state.position);
-        }
-      }
-    }, {
-      key: "preventKeyboardScroll",
-      value: function preventKeyboardScroll(event) {
-        var containerElement = this.dropElement;
-        var keys = [32, 37, 38, 39, 40]; // Space, Arrow keys
-
-        if (containerElement && containerElement !== event.target && !containerElement.contains(event.target) && keys.includes(event.keyCode)) {
-          event.preventDefault();
-        }
-      }
     }, {
       key: "getGroup",
       value: function getGroup() {
@@ -680,19 +587,15 @@ var Popup = function Popup(Component) {
                       _ref6$left = _ref6.left,
                       oldLeft = _ref6$left === void 0 ? '' : _ref6$left,
                       _ref6$top = _ref6.top,
-                      oldTop = _ref6$top === void 0 ? '' : _ref6$top,
-                      _ref6$bottom = _ref6.bottom,
-                      oldBottom = _ref6$bottom === void 0 ? '' : _ref6$bottom;
+                      oldTop = _ref6$top === void 0 ? '' : _ref6$top;
 
                   var _ref7 = viewsOffset[view] || {},
                       _ref7$left = _ref7.left,
                       left = _ref7$left === void 0 ? '' : _ref7$left,
                       _ref7$top = _ref7.top,
-                      top = _ref7$top === void 0 ? '' : _ref7$top,
-                      _ref7$bottom = _ref7.bottom,
-                      bottom = _ref7$bottom === void 0 ? '' : _ref7$bottom;
+                      top = _ref7$top === void 0 ? '' : _ref7$top;
 
-                  var changeState = isAbsolute ? position !== view : oldLeft !== left || oldTop !== top || oldBottom !== bottom; // let isInViewPort = viewPort.isInViewPort(
+                  var changeState = isAbsolute ? position !== view : oldLeft !== left || oldTop !== top; // let isInViewPort = viewPort.isInViewPort(
                   //   placeHolderElement,
                   //   scrollContainer
                   // );
@@ -802,8 +705,9 @@ var Popup = function Popup(Component) {
   }(_react["default"].Component);
 
   Popup.displayName = Component.displayName || Component.name || Popup.name;
-  Popup.contextTypes = _propTypes.ContextTypes;
-  Popup.propTypes = _propTypes.PopupPropTypes;
+  Popup.contextTypes = {
+    direction: _propTypes["default"].string
+  };
   return (0, _hoistNonReactStatics["default"])(Popup, Component);
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-temp-210.1",
+  "version": "1.0.0-temp-199.2",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -38,7 +38,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 build && npm run rtl && npm run cssVariableConvert ",
-    "prepublishOnly": "node prePublish.js && npm run css:review && npm run review:props ",
+    "prepublishOnly": "node prePublish.js && npm run download && npm run css:review",
     "postpublish": "node postPublish.js",
     "report": "react-cli publish:report",
     "test": "react-cli test",
@@ -71,7 +71,7 @@
     "@zohodesk/a11y": "2.2.6",
     "@zohodesk/docstool": "1.0.0-alpha-2",
     "@zohodesk/hooks": "2.0.5",
-    "@zohodesk/icons": "1.0.61",
+    "@zohodesk/icons": "1.0.62",
     "@zohodesk/svg": "1.1.19",
     "@zohodesk/utils": "1.3.14",
     "@zohodesk/variables": "1.0.0",
@@ -86,7 +86,7 @@
     "selectn": "1.1.2"
   },
   "peerDependencies": {
-    "@zohodesk/icons": "1.0.61",
+    "@zohodesk/icons": "1.0.62",
     "@zohodesk/variables": "1.0.0",
     "@zohodesk/svg": "1.1.19",
     "@zohodesk/virtualizer": "1.0.3",