@zohodesk/components 1.0.0-temp-69 → 1.0.0-temp-71

package/lib/Select/SelectWithAvatar.js

@@ -9,14 +9,14 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _defaultProps = require("./props/defaultProps");
-
-var _propTypes = require("./props/propTypes");
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _Select = require("./Select");
 
 var _Popup = _interopRequireDefault(require("../Popup/Popup"));
 
+var _DropBox = _interopRequireDefault(require("../DropBox/DropBox"));
+
 var _Tag = _interopRequireDefault(require("../Tag/Tag"));
 
 var _TextBox = _interopRequireDefault(require("../TextBox/TextBox"));
@@ -35,10 +35,6 @@ var _DropDownHeading = _interopRequireDefault(require("../DropDown/DropDownHeadi
 
 var _IdProvider = require("../Provider/IdProvider");
 
-var _ResponsiveDropBox = _interopRequireDefault(require("../ResponsiveDropBox/ResponsiveDropBox"));
-
-var _CustomResponsive = require("../Responsive/CustomResponsive");
-
 var _MultiSelectModule = _interopRequireDefault(require("../MultiSelect/MultiSelect.module.css"));
 
 var _SelectModule = _interopRequireDefault(require("./Select.module.css"));
@@ -155,21 +151,9 @@ var SelectWithAvatarComponent = /*#__PURE__*/function (_SelectComponent) {
         this.handleKeyDown(e);
       }
     }
-  }, {
-    key: "responsiveFunc",
-    value: function responsiveFunc(_ref2) {
-      var mediaQueryOR = _ref2.mediaQueryOR;
-      return {
-        tabletMode: mediaQueryOR([{
-          maxWidth: 700
-        }])
-      };
-    }
   }, {
     key: "render",
     value: function render() {
-      var _this2 = this;
-
       var _this$props = this.props,
           dropBoxSize = _this$props.dropBoxSize,
           emptyMessage = _this$props.emptyMessage,
@@ -218,10 +202,10 @@ var SelectWithAvatarComponent = /*#__PURE__*/function (_SelectComponent) {
           options = _this$state.options;
       var suggestions = this.handleFilterSuggestions();
 
-      var _ref3 = this.normalizedFormatOptions[selectedId] || {},
-          id = _ref3.id,
-          text = _ref3.value,
-          photoURL = _ref3.photoURL;
+      var _ref2 = this.normalizedFormatOptions[selectedId] || {},
+          id = _ref2.id,
+          text = _ref2.value,
+          photoURL = _ref2.photoURL;
 
       var setAriaId = this.getNextAriaId();
       var ariaErrorId = this.getNextAriaId();
@@ -281,90 +265,156 @@ var SelectWithAvatarComponent = /*#__PURE__*/function (_SelectComponent) {
         borderColor: borderColor,
         htmlId: htmlId,
         autoComplete: false
-      }))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/_react["default"].createElement(_CustomResponsive.ResponsiveReceiver, {
-        query: this.responsiveFunc,
-        responsiveId: "Helmet"
-      }, function (_ref4) {
-        var tabletMode = _ref4.tabletMode;
-        return /*#__PURE__*/_react["default"].createElement(_ResponsiveDropBox["default"], {
-          animationStyle: animationStyle,
-          boxPosition: position || "".concat(defaultDropBoxPosition, "Center"),
-          getRef: getContainerRef,
-          isActive: isPopupReady,
-          isAnimate: true,
-          isArrow: false,
-          onClick: removeClose,
-          needResponsive: needResponsive,
-          isPadding: false,
-          isResponsivePadding: true,
-          alignBox: "row"
-        }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-          flexible: true
-        }, /*#__PURE__*/_react["default"].createElement(_Card["default"], {
-          onScroll: _this2.handleScroll
-        }, needSearch ? /*#__PURE__*/_react["default"].createElement(_Card.CardHeader, null, /*#__PURE__*/_react["default"].createElement("div", {
-          className: "".concat(_SelectModule["default"].search, " ").concat(_SelectModule["default"][size])
-        }, /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], {
-          inputRef: _this2.searchInputRef,
-          maxLength: maxLength,
-          onChange: _this2.handleSearch,
-          onKeyDown: _this2.handleKeyDown,
-          placeHolder: searchBoxPlaceHolder,
-          size: searchBoxSize,
-          value: searchStr,
-          onClear: _this2.handleClearSearch,
-          dataId: "".concat(dataId, "_search"),
-          a11y: {
-            ariaAutocomplete: 'list',
-            ariaControls: setAriaId,
-            ariaDescribedby: ariaErrorId
-          },
-          autoComplete: false
-        }))) : null, /*#__PURE__*/_react["default"].createElement(_Card.CardContent, {
-          shrink: true,
-          customClass: !tabletMode && dropBoxSize ? _MultiSelectModule["default"][dropBoxSize] : '',
-          eleRef: _this2.suggestionContainerRef
-        }, groupName ? /*#__PURE__*/_react["default"].createElement("div", {
-          className: _MultiSelectModule["default"].title
-        }, /*#__PURE__*/_react["default"].createElement(_DropDownHeading["default"], {
-          text: groupName,
-          a11y: {
-            role: 'heading'
-          }
-        })) : null, suggestions.length ? /*#__PURE__*/_react["default"].createElement(_Suggestions["default"], {
-          activeId: selectedId,
-          suggestions: suggestions,
-          getRef: _this2.suggestionItemRef,
-          hoverOption: hoverIndex,
-          onClick: _this2.handleChange,
-          onMouseEnter: _this2.handleMouseEnter,
-          needTick: true,
-          needBorder: false,
-          selectedOptions: [selectedId],
-          className: _SelectModule["default"].listItemContainer,
-          htmlId: setAriaId,
-          a11y: {
-            ariaParentRole: 'listbox',
-            role: 'option'
-          }
-        }) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
-          isLoading: isFetchingOptions,
-          options: options,
-          searchString: searchStr,
-          suggestions: suggestions,
-          dataId: dataId,
-          i18nKeys: i18nKeys,
-          htmlId: ariaErrorId
-        })))));
-      }) : null);
+      }))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/_react["default"].createElement(_DropBox["default"], {
+        animationStyle: animationStyle,
+        boxPosition: position || "".concat(defaultDropBoxPosition, "Center"),
+        getRef: getContainerRef,
+        isActive: isPopupReady,
+        isAnimate: true,
+        isArrow: false,
+        onClick: removeClose,
+        needResponsive: needResponsive,
+        isPadding: false
+      }, /*#__PURE__*/_react["default"].createElement(_Card["default"], {
+        onScroll: this.handleScroll
+      }, needSearch ? /*#__PURE__*/_react["default"].createElement(_Card.CardHeader, null, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "".concat(_SelectModule["default"].search, " ").concat(_SelectModule["default"][size])
+      }, /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], {
+        inputRef: this.searchInputRef,
+        maxLength: maxLength,
+        onChange: this.handleSearch,
+        onKeyDown: this.handleKeyDown,
+        placeHolder: searchBoxPlaceHolder,
+        size: searchBoxSize,
+        value: searchStr,
+        onClear: this.handleClearSearch,
+        dataId: "".concat(dataId, "_search"),
+        a11y: {
+          ariaAutocomplete: 'list',
+          ariaControls: setAriaId,
+          ariaDescribedby: ariaErrorId
+        },
+        autoComplete: false
+      }))) : null, /*#__PURE__*/_react["default"].createElement(_Card.CardContent, {
+        customClass: dropBoxSize ? _MultiSelectModule["default"][dropBoxSize] : '',
+        eleRef: this.suggestionContainerRef
+      }, groupName ? /*#__PURE__*/_react["default"].createElement("div", {
+        className: _MultiSelectModule["default"].title
+      }, /*#__PURE__*/_react["default"].createElement(_DropDownHeading["default"], {
+        text: groupName,
+        a11y: {
+          role: 'heading'
+        }
+      })) : null, suggestions.length ? /*#__PURE__*/_react["default"].createElement(_Suggestions["default"], {
+        activeId: selectedId,
+        suggestions: suggestions,
+        getRef: this.suggestionItemRef,
+        hoverOption: hoverIndex,
+        onClick: this.handleChange,
+        onMouseEnter: this.handleMouseEnter,
+        needTick: true,
+        needBorder: false,
+        selectedOptions: [selectedId],
+        className: _SelectModule["default"].listItemContainer,
+        htmlId: setAriaId,
+        a11y: {
+          ariaParentRole: 'listbox',
+          role: 'option'
+        }
+      }) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+        isLoading: isFetchingOptions,
+        options: options,
+        searchString: searchStr,
+        suggestions: suggestions,
+        dataId: dataId,
+        i18nKeys: i18nKeys,
+        htmlId: ariaErrorId
+      })))) : null);
     }
   }]);
 
   return SelectWithAvatarComponent;
 }(_Select.SelectComponent);
 
-SelectWithAvatarComponent.propTypes = _propTypes.SelectWithAvatar_propTypes;
-SelectWithAvatarComponent.defaultProps = _defaultProps.SelectWithAvatar_defaultProps;
+SelectWithAvatarComponent.propTypes = {
+  animationStyle: _propTypes["default"].string,
+  avatarPalette: _propTypes["default"].string,
+  borderColor: _propTypes["default"].oneOf(['transparent', 'default']),
+  className: _propTypes["default"].string,
+  closePopupOnly: _propTypes["default"].func,
+  dataId: _propTypes["default"].string,
+  defaultDropBoxPosition: _propTypes["default"].oneOf(['bottom', 'top', 'left', 'right']),
+  dropBoxSize: _propTypes["default"].oneOf(['small', 'medium', 'large']),
+  emptyMessage: _propTypes["default"].string,
+  excludeOptions: _propTypes["default"].array,
+  getContainerRef: _propTypes["default"].func,
+  getNextOptions: _propTypes["default"].func,
+  getRef: _propTypes["default"].func,
+  groupName: _propTypes["default"].string,
+  i18nKeys: _propTypes["default"].shape({
+    loadingText: _propTypes["default"].string,
+    emptyText: _propTypes["default"].string,
+    noMoreText: _propTypes["default"].string,
+    searchEmptyText: _propTypes["default"].string
+  }),
+  isDisabled: _propTypes["default"].bool,
+  isNextOptions: _propTypes["default"].bool,
+  isPopupOpen: _propTypes["default"].bool,
+  isPopupReady: _propTypes["default"].bool,
+  isReadOnly: _propTypes["default"].bool,
+  isSearchClearOnClose: _propTypes["default"].bool,
+  maxLength: _propTypes["default"].string,
+  needBorder: _propTypes["default"].bool,
+  needLocalSearch: _propTypes["default"].bool,
+  needResponsive: _propTypes["default"].bool,
+  onChange: _propTypes["default"].func.isRequired,
+  onDropBoxClose: _propTypes["default"].func,
+  onDropBoxOpen: _propTypes["default"].func,
+  onRemove: _propTypes["default"].func,
+  onSearch: _propTypes["default"].func,
+  options: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].string), _propTypes["default"].arrayOf(_propTypes["default"].shape({
+    id: _propTypes["default"].string,
+    text: _propTypes["default"].string,
+    photoURL: _propTypes["default"].string
+  }))]).isRequired,
+  position: _propTypes["default"].string,
+  removeClose: _propTypes["default"].func,
+  searchDebounceTime: _propTypes["default"].number,
+  searchEmptyMessage: _propTypes["default"].string,
+  selectedValue: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  size: _propTypes["default"].oneOf(['small', 'medium']),
+  tagSize: _propTypes["default"].string,
+  textBoxSize: _propTypes["default"].string,
+  textBoxVariant: _propTypes["default"].string,
+  textField: _propTypes["default"].string,
+  title: _propTypes["default"].string,
+  togglePopup: _propTypes["default"].func,
+  valueField: _propTypes["default"].string,
+  htmlId: _propTypes["default"].string,
+  needEffect: _propTypes["default"].bool
+};
+SelectWithAvatarComponent.defaultProps = {
+  animationStyle: 'bounce',
+  defaultDropBoxPosition: 'bottom',
+  dropBoxSize: 'small',
+  isDefaultSelectValue: false,
+  isDisabled: false,
+  isReadOnly: false,
+  needBorder: true,
+  needLocalSearch: true,
+  needSearch: true,
+  placeHolder: '',
+  size: 'medium',
+  textBoxSize: 'medium',
+  textBoxVariant: 'default',
+  textField: 'text',
+  valueField: 'id',
+  dataId: 'selectWithAvatar',
+  borderColor: 'default',
+  isSearchClearOnClose: true,
+  i18nKeys: {},
+  needEffect: true
+};
 SelectWithAvatarComponent.displayName = 'SelectWithAvatar';
 var SelectWithAvatar = (0, _Popup["default"])(SelectWithAvatarComponent);
 SelectWithAvatar.defaultProps = SelectWithAvatarComponent.defaultProps;

package/lib/Select/SelectWithIcon.js

@@ -9,9 +9,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _defaultProps = require("./props/defaultProps");
-
-var _propTypes = require("./props/propTypes");
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _Popup = _interopRequireDefault(require("../Popup/Popup"));
 
@@ -19,6 +17,8 @@ var _TextBoxIcon = _interopRequireDefault(require("../TextBoxIcon/TextBoxIcon"))
 
 var _Icon = _interopRequireDefault(require("@zohodesk/icons/lib/Icon"));
 
+var _DropBox = _interopRequireDefault(require("../DropBox/DropBox"));
+
 var _ListItemWithIcon = _interopRequireDefault(require("../ListItem/ListItemWithIcon"));
 
 var _Card = _interopRequireWildcard(require("../Card/Card"));
@@ -29,20 +29,20 @@ var _Layout = require("../Layout");
 
 var _IdProvider = require("../Provider/IdProvider");
 
-var _ResponsiveDropBox = _interopRequireDefault(require("../ResponsiveDropBox/ResponsiveDropBox"));
-
-var _CustomResponsive = require("../Responsive/CustomResponsive");
-
 var _Common = require("../utils/Common.js");
 
 var _SelectModule = _interopRequireDefault(require("./Select.module.css"));
 
+var _SelectWithIcon$defau;
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 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; }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 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); } }
@@ -294,16 +294,6 @@ var SelectWithIcon = /*#__PURE__*/function (_Component) {
         isNextOptions && getNextOptions && getNextOptions(e);
       }
     }
-  }, {
-    key: "responsiveFunc",
-    value: function responsiveFunc(_ref) {
-      var mediaQueryOR = _ref.mediaQueryOR;
-      return {
-        tabletMode: mediaQueryOR([{
-          maxWidth: 700
-        }])
-      };
-    }
   }, {
     key: "render",
     value: function render() {
@@ -418,99 +408,141 @@ var SelectWithIcon = /*#__PURE__*/function (_Component) {
       }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], {
         name: "ZD-down",
         size: "7"
-      })))))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/_react["default"].createElement(_CustomResponsive.ResponsiveReceiver, {
-        query: this.responsiveFunc,
-        responsiveId: "Helmet"
-      }, function (_ref2) {
-        var tabletMode = _ref2.tabletMode;
-        return /*#__PURE__*/_react["default"].createElement(_ResponsiveDropBox["default"], {
-          animationStyle: animationStyle,
-          boxPosition: position,
-          isActive: isPopupReady,
-          isAnimate: true,
-          isArrow: false,
-          onClick: removeClose,
-          getRef: getContainerRef,
-          needResponsive: needResponsive,
-          dataId: "".concat(dataId, "_suggestions"),
-          size: boxSize,
-          isPadding: false,
-          isResponsivePadding: true,
-          alignBox: "row"
-        }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-          flexible: true
-        }, /*#__PURE__*/_react["default"].createElement(_Card["default"], {
-          onScroll: _this4.handleScroll,
-          htmlId: setAriaId,
+      })))))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/_react["default"].createElement(_DropBox["default"], {
+        animationStyle: animationStyle,
+        boxPosition: position,
+        isActive: isPopupReady,
+        isAnimate: true,
+        isArrow: false,
+        onClick: removeClose,
+        getRef: getContainerRef,
+        needResponsive: needResponsive,
+        dataId: "".concat(dataId, "_suggestions"),
+        size: boxSize,
+        isPadding: false
+      }, /*#__PURE__*/_react["default"].createElement(_Card["default"], {
+        onScroll: this.handleScroll,
+        htmlId: setAriaId,
+        a11y: {
+          role: 'listbox'
+        }
+      }, needSearch ? /*#__PURE__*/_react["default"].createElement(_Card.CardHeader, null, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "".concat(_SelectModule["default"].search, " ").concat(_SelectModule["default"][size])
+      }, /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], {
+        onClear: this.onSearchClear,
+        onChange: this.onSearch,
+        placeHolder: searchBoxPlaceHolder,
+        value: searchValue,
+        maxLength: maxLength,
+        onKeyDown: this.handleKeyDown,
+        inputRef: this.searchInputRef,
+        size: searchBoxSize,
+        dataId: "".concat(dataId, "_search"),
+        a11y: {
+          ariaDescribedby: ariaErrorId
+        },
+        autoComplete: false
+      }))) : null, /*#__PURE__*/_react["default"].createElement(_Card.CardContent, {
+        customClass: "".concat(_SelectModule["default"].dropBoxList, " ").concat(dropBoxSize ? _SelectModule["default"][dropBoxSize] : ''),
+        eleRef: this.scrollContentRef
+      }, options.length ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, options.map(function (options, i) {
+        var iconName = options.iconName,
+            iconSize = options.iconSize,
+            iconColor = options.iconColor;
+        return /*#__PURE__*/_react["default"].createElement(_ListItemWithIcon["default"], {
+          key: options[idKey],
+          value: options[valueKey],
+          size: "medium",
+          onClick: _this4.handleChange,
+          id: options[idKey],
+          index: i,
+          title: options[valueKey],
+          palette: "default",
+          dataId: options[idKey],
+          iconName: iconName,
+          iconSize: iconSize,
+          iconClass: iconColor,
+          active: selectedId === options[idKey],
+          needBorder: needListBorder,
+          needTick: needTick,
+          onMouseEnter: _this4.handleMouseEnter,
+          highlight: selectedIndex === i,
+          getRef: _this4.itemRef,
           a11y: {
-            role: 'listbox'
+            role: 'option',
+            ariaSelected: selectedId === options[idKey]
           }
-        }, needSearch ? /*#__PURE__*/_react["default"].createElement(_Card.CardHeader, null, /*#__PURE__*/_react["default"].createElement("div", {
-          className: "".concat(_SelectModule["default"].search, " ").concat(_SelectModule["default"][size])
-        }, /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], {
-          onClear: _this4.onSearchClear,
-          onChange: _this4.onSearch,
-          placeHolder: searchBoxPlaceHolder,
-          value: searchValue,
-          maxLength: maxLength,
-          onKeyDown: _this4.handleKeyDown,
-          inputRef: _this4.searchInputRef,
-          size: searchBoxSize,
-          dataId: "".concat(dataId, "_search"),
-          a11y: {
-            ariaDescribedby: ariaErrorId
-          },
-          autoComplete: false
-        }))) : null, /*#__PURE__*/_react["default"].createElement(_Card.CardContent, {
-          customClass: "".concat(tabletMode ? _SelectModule["default"].responsivedropBoxList : _SelectModule["default"].dropBoxList, " ").concat(!tabletMode && dropBoxSize ? _SelectModule["default"][dropBoxSize] : ''),
-          shrink: true,
-          eleRef: _this4.scrollContentRef
-        }, options.length ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, options.map(function (options, i) {
-          var iconName = options.iconName,
-              iconSize = options.iconSize,
-              iconColor = options.iconColor;
-          return /*#__PURE__*/_react["default"].createElement(_ListItemWithIcon["default"], {
-            key: options[idKey],
-            value: options[valueKey],
-            size: "medium",
-            onClick: _this4.handleChange,
-            id: options[idKey],
-            index: i,
-            title: options[valueKey],
-            palette: "default",
-            dataId: options[idKey],
-            iconName: iconName,
-            iconSize: iconSize,
-            iconClass: iconColor,
-            active: selectedId === options[idKey],
-            needBorder: needListBorder,
-            needTick: needTick,
-            onMouseEnter: _this4.handleMouseEnter,
-            highlight: selectedIndex === i,
-            getRef: _this4.itemRef,
-            a11y: {
-              role: 'option',
-              ariaSelected: selectedId === options[idKey]
-            }
-          });
-        })) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
-          isLoading: isFetchingOptions,
-          options: options,
-          searchString: searchValue,
-          suggestions: options,
-          dataId: dataId,
-          i18nKeys: i18nKeys,
-          htmlId: ariaErrorId
-        })))));
-      }) : null);
+        });
+      })) : /*#__PURE__*/_react["default"].createElement(_EmptyState["default"], {
+        isLoading: isFetchingOptions,
+        options: options,
+        searchString: searchValue,
+        suggestions: options,
+        dataId: dataId,
+        i18nKeys: i18nKeys,
+        htmlId: ariaErrorId
+      })))) : null);
     }
   }]);
 
   return SelectWithIcon;
 }(_react.Component);
 
-SelectWithIcon.propTypes = _propTypes.SelectWithIcon_propTypes;
-SelectWithIcon.defaultProps = _defaultProps.SelectWithIcon_defaultProps;
+SelectWithIcon.propTypes = {
+  animationStyle: _propTypes["default"].oneOf(['default', 'bounce']),
+  borderColor: _propTypes["default"].oneOf(['transparent', 'default']),
+  boxPosition: _propTypes["default"].oneOf(['bottomRight', 'bottomLeft', 'bottomCenter', 'topRight', 'topLeft', 'topCenter', 'rightTop', 'rightBottom', 'rightCenter', 'leftTop', 'leftBottom', 'leftCenter']),
+  dataId: _propTypes["default"].string,
+  dropBoxSize: _propTypes["default"].oneOf(['small', 'medium', 'large']),
+  getContainerRef: _propTypes["default"].func,
+  getNextOptions: _propTypes["default"].func,
+  getTargetRef: _propTypes["default"].func,
+  i18nKeys: _propTypes["default"].shape({
+    loadingText: _propTypes["default"].string,
+    emptyText: _propTypes["default"].string,
+    noMoreText: _propTypes["default"].string,
+    searchEmptyText: _propTypes["default"].string
+  }),
+  iconClass: _propTypes["default"].string,
+  iconName: _propTypes["default"].string,
+  iconSize: _propTypes["default"].string,
+  idKey: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  isNextOptions: _propTypes["default"].bool,
+  isPopupOpen: _propTypes["default"].bool,
+  isPopupReady: _propTypes["default"].bool,
+  isReadOnly: _propTypes["default"].bool,
+  maxLength: _propTypes["default"].string,
+  needIcon: _propTypes["default"].bool,
+  needListBorder: _propTypes["default"].bool,
+  needSearch: _propTypes["default"].bool,
+  needTick: _propTypes["default"].bool,
+  onChange: _propTypes["default"].func,
+  options: _propTypes["default"].array,
+  placeHolder: _propTypes["default"].string,
+  position: _propTypes["default"].string,
+  removeClose: _propTypes["default"].func,
+  searchBoxPlaceHolder: _propTypes["default"].string,
+  searchEmptyMessage: _propTypes["default"].string,
+  selectedId: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  selectedValue: _propTypes["default"].string,
+  size: _propTypes["default"].oneOf(['small', 'medium']),
+  textBoxSize: _propTypes["default"].oneOf(['small', 'medium', 'xmedium']),
+  textBoxVariant: _propTypes["default"].oneOf(['primary', 'secondary', 'default']),
+  togglePopup: _propTypes["default"].func,
+  valueKey: _propTypes["default"].string,
+  htmlId: _propTypes["default"].string
+};
+SelectWithIcon.defaultProps = (_SelectWithIcon$defau = {
+  isReadOnly: false,
+  isDisabled: false,
+  animationStyle: 'bounce',
+  valueKey: 'value',
+  idKey: 'id',
+  needListBorder: false,
+  needSearch: false,
+  boxSize: 'default'
+}, _defineProperty(_SelectWithIcon$defau, "needListBorder", false), _defineProperty(_SelectWithIcon$defau, "needCloseOnSelect", true), _defineProperty(_SelectWithIcon$defau, "borderColor", 'default'), _defineProperty(_SelectWithIcon$defau, "needTick", true), _defineProperty(_SelectWithIcon$defau, "searchBoxSize", 'small'), _defineProperty(_SelectWithIcon$defau, "size", 'medium'), _defineProperty(_SelectWithIcon$defau, "textBoxSize", 'medium'), _defineProperty(_SelectWithIcon$defau, "textBoxVariant", 'default'), _defineProperty(_SelectWithIcon$defau, "dataId", 'selectWithIcon'), _defineProperty(_SelectWithIcon$defau, "dropBoxSize", 'small'), _defineProperty(_SelectWithIcon$defau, "needIcon", true), _defineProperty(_SelectWithIcon$defau, "iconSize", '14'), _defineProperty(_SelectWithIcon$defau, "i18nKeys", {}), _SelectWithIcon$defau);
 
 if (false) {
   SelectWithIcon.docs = {

package/lib/Stencils/Stencils.js

@@ -9,9 +9,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _defaultProps = require("./props/defaultProps");
-
-var _propTypes = require("./props/propTypes");
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _StencilsModule = _interopRequireDefault(require("./Stencils.module.css"));
 
@@ -68,8 +66,22 @@ var Stencils = /*#__PURE__*/function (_React$PureComponent) {
 }(_react["default"].PureComponent);
 
 exports["default"] = Stencils;
-Stencils.propTypes = _propTypes.propTypes;
-Stencils.defaultProps = _defaultProps.defaultProps;
+Stencils.propTypes = {
+  palette: _propTypes["default"].oneOf(['primary', 'secondary', 'dark']),
+  shape: _propTypes["default"].oneOf(['rect', 'circle']),
+  size: _propTypes["default"].oneOf(['small', 'medium', 'large', 'default']),
+  customClass: _propTypes["default"].string
+};
+Stencils.defaultProps = {
+  palette: 'primary',
+  shape: 'rect',
+  size: 'medium',
+  customClass: ''
+}; // Stencils.propTypesDescription = {
+//   shape: ' ',
+//   size: ' ',
+//   palette: ' '
+// };
 
 if (false) {
   Stencils.docs = {