@zohodesk/components 1.0.0-temp-255 → 1.0.0-temp-252.4

package/es/Responsive/ResizeComponent.js

@@ -163,7 +163,9 @@ export default class ResizeComponent extends React.Component {
     }
   }
 
-  constructChildren(dataCount = 0, responsive) {
+  constructChildren() {
+    let dataCount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
+    let responsive = arguments.length > 1 ? arguments[1] : undefined;
     const {
       childrenList,
       getData

package/es/Responsive/Responsive.js

@@ -96,7 +96,8 @@ ResponsiveSender.defaultProps = { ...ResponsiveSender_defaultProps,
 };
 ResponsiveSender.contextType = ResponsiveContext;
 ResponsiveSender.propTypes = ResponsiveSender_propTypes;
-export function useResponsiveReceiver(responsiveId = defaultResponsiveId) {
+export function useResponsiveReceiver() {
+  let responsiveId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultResponsiveId;
   const [_, forceUpdate] = useState();
   let totalContextData = useContext(ResponsiveContext);
   let contextData = totalContextData[responsiveId] || totalContextData[defaultResponsiveId]; // NOTE: this for fallback of if responsive receiver id wrong
@@ -143,7 +144,8 @@ export function useResponsiveReceiver(responsiveId = defaultResponsiveId) {
         return value1 <= width && value2 >= width || breakPoint1 === breakPoint || breakPoint2 === breakPoint;
       },
 
-      deviceOnly(breakPoints = []) {
+      deviceOnly() {
+        let breakPoints = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
         return breakPoints.includes(breakPoint);
       },
 
@@ -168,13 +170,14 @@ export function useResponsiveReceiver(responsiveId = defaultResponsiveId) {
 //   ) : null;
 // }
 
-export function ResponsiveReceiver({
-  children,
-  responsiveId,
-  hiddenSizes,
-  eleRef,
-  domRefKey
-}) {
+export function ResponsiveReceiver(_ref) {
+  let {
+    children,
+    responsiveId,
+    hiddenSizes,
+    eleRef,
+    domRefKey
+  } = _ref;
   const data = useResponsiveReceiver(responsiveId);
   const {
     breakPoint

package/es/Responsive/sizeObservers.js

@@ -75,7 +75,11 @@ export class Subscribale {
     this.subscribers.length && this.disconnect();
   }
 
-  dispatch(...args) {
+  dispatch() {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
     this.subscribers.forEach(subscriber => {
       subscriber(...args);
     });

package/es/ResponsiveDropBox/ResponsiveDropBox.js

@@ -13,9 +13,10 @@ export default class ResponsiveDropBox extends Component {
     this.responsiveFunc = this.responsiveFunc.bind(this);
   }
 
-  responsiveFunc({
-    mediaQueryOR
-  }) {
+  responsiveFunc(_ref) {
+    let {
+      mediaQueryOR
+    } = _ref;
     return {
       tabletMode: mediaQueryOR([{
         maxWidth: 700
@@ -49,13 +50,16 @@ export default class ResponsiveDropBox extends Component {
     }), /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: "Helmet"
-    }, ({
-      tabletMode
-    }) => /*#__PURE__*/React.createElement(Container, {
-      alignBox: alignBox,
-      isCover: false,
-      className: `${tabletMode ? style.dropBoxContainer : ''} ${tabletMode && isResponsivePadding ? style.boxPadding : ''} ${customResponsiveContainer}`
-    }, children)));
+    }, _ref2 => {
+      let {
+        tabletMode
+      } = _ref2;
+      return /*#__PURE__*/React.createElement(Container, {
+        alignBox: alignBox,
+        isCover: false,
+        className: `${tabletMode ? style.dropBoxContainer : ''} ${tabletMode && isResponsivePadding ? style.boxPadding : ''} ${customResponsiveContainer}`
+      }, children);
+    }));
   }
 
 }

package/es/Select/GroupSelect.js

@@ -493,7 +493,8 @@ export class GroupSelectComponent extends PureComponent {
     isScrollReachedBottom && this.handleGetNextOptions();
   }
 
-  handleFetchOptions(APICall, searchStr = '') {
+  handleFetchOptions(APICall) {
+    let searchStr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     // let funcArgs = args.slice(1, args.length);
     let {
       isFetchingOptions = false
@@ -536,9 +537,10 @@ export class GroupSelectComponent extends PureComponent {
     isNextOptions && getNextOptions && this.handleFetchOptions(getNextOptions, searchStr);
   }
 
-  responsiveFunc({
-    mediaQueryOR
-  }) {
+  responsiveFunc(_ref) {
+    let {
+      mediaQueryOR
+    } = _ref;
     return {
       tabletMode: mediaQueryOR([{
         maxWidth: 700
@@ -714,104 +716,107 @@ export class GroupSelectComponent extends PureComponent {
     }, TextBoxProps)))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: "Helmet"
-    }, ({
-      tabletMode
-    }) => /*#__PURE__*/React.createElement(ResponsiveDropBox, {
-      animationStyle: animationStyle,
-      boxPosition: position || `${defaultDropBoxPosition}Center`,
-      getRef: getContainerRef,
-      isActive: isPopupReady,
-      isAnimate: true,
-      isArrow: false,
-      onClick: removeClose,
-      needResponsive: needResponsive,
-      isPadding: false,
-      isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
-      positionsOffset: positionsOffset,
-      targetOffset: targetOffset,
-      isRestrictScroll: isRestrictScroll,
-      isResponsivePadding: getFooter ? false : true,
-      alignBox: "row",
-      dataId: `${dataId}_suggestionBox`,
-      customClass: {
-        customDropBox: dropBoxClass
-      }
-    }, isLoading ? /*#__PURE__*/React.createElement(Container, {
-      align: "both",
-      className: style.loader
-    }, /*#__PURE__*/React.createElement(Loader, null)) : /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, /*#__PURE__*/React.createElement(Card, {
-      customClass: style.box,
-      onScroll: this.handleScroll
-    }, needSearch ? /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement("div", {
-      className: `${style.search} ${style[size]}`
-    }, /*#__PURE__*/React.createElement(TextBoxIcon, {
-      inputRef: this.searchInputRef,
-      maxLength: maxLength,
-      onChange: this.handleSearch,
-      onKeyDown: this.handleKeyDown,
-      placeHolder: searchBoxPlaceHolder,
-      size: searchBoxSize,
-      value: searchStr,
-      onClear: this.handleClearSearch,
-      a11y: {
-        ariaControls: setAriaId,
-        ariaAutocomplete: 'list',
-        ariaDescribedby: ariaErrorId
-      },
-      autoComplete: false,
-      dataId: `${dataId}_search`
-    }))) : null, /*#__PURE__*/React.createElement(CardContent, {
-      shrink: true,
-      customClass: `${!tabletMode && dropBoxSize ? style[dropBoxSize] : ''} ${cardContentClass}`,
-      eleRef: this.suggestionContainerRef
-    }, suggestionGroups.length ? suggestionGroups.map(group => {
+    }, _ref2 => {
       let {
-        id: groupId,
-        name: groupName,
-        options
-      } = group;
-      let hoverId = suggestionOptionIds[hoverIndex];
-      return /*#__PURE__*/React.createElement(React.Fragment, {
-        key: groupId
-      }, groupName && /*#__PURE__*/React.createElement("div", {
-        className: style.groupTitle
-      }, /*#__PURE__*/React.createElement(DropDownHeading, {
-        text: groupName,
-        a11y: {
-          role: 'heading'
+        tabletMode
+      } = _ref2;
+      return /*#__PURE__*/React.createElement(ResponsiveDropBox, {
+        animationStyle: animationStyle,
+        boxPosition: position || `${defaultDropBoxPosition}Center`,
+        getRef: getContainerRef,
+        isActive: isPopupReady,
+        isAnimate: true,
+        isArrow: false,
+        onClick: removeClose,
+        needResponsive: needResponsive,
+        isPadding: false,
+        isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+        positionsOffset: positionsOffset,
+        targetOffset: targetOffset,
+        isRestrictScroll: isRestrictScroll,
+        isResponsivePadding: getFooter ? false : true,
+        alignBox: "row",
+        dataId: `${dataId}_suggestionBox`,
+        customClass: {
+          customDropBox: dropBoxClass
         }
-      })), /*#__PURE__*/React.createElement(Suggestions, _extends({
-        activeId: selectedId,
-        suggestions: options,
-        getRef: this.suggestionItemRef,
-        hoverId: hoverId,
-        onClick: this.handleChange,
-        onMouseEnter: this.handleMouseEnter,
-        selectedOptions: [selectedId],
-        needTick: needTick,
-        needBorder: false,
-        htmlId: setAriaId,
+      }, isLoading ? /*#__PURE__*/React.createElement(Container, {
+        align: "both",
+        className: style.loader
+      }, /*#__PURE__*/React.createElement(Loader, null)) : /*#__PURE__*/React.createElement(Box, {
+        flexible: true
+      }, /*#__PURE__*/React.createElement(Card, {
+        customClass: style.box,
+        onScroll: this.handleScroll
+      }, needSearch ? /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement("div", {
+        className: `${style.search} ${style[size]}`
+      }, /*#__PURE__*/React.createElement(TextBoxIcon, {
+        inputRef: this.searchInputRef,
+        maxLength: maxLength,
+        onChange: this.handleSearch,
+        onKeyDown: this.handleKeyDown,
+        placeHolder: searchBoxPlaceHolder,
+        size: searchBoxSize,
+        value: searchStr,
+        onClear: this.handleClearSearch,
         a11y: {
-          ariaParentRole: 'listbox',
-          role: 'option'
+          ariaControls: setAriaId,
+          ariaAutocomplete: 'list',
+          ariaDescribedby: ariaErrorId
         },
-        dataId: `${dataId}_Options`
-      }, SuggestionsProps)));
-    }) : /*#__PURE__*/React.createElement(EmptyState, {
-      options: revampedGroups,
-      searchString: searchStr,
-      suggestions: suggestionGroups,
-      renderCustomEmptyState: renderCustomEmptyState,
-      dataId: dataIdSrchEmptyMsg,
-      isLoading: isFetchingOptions,
-      i18nKeys: i18nKeys,
-      htmlId: ariaErrorId
-    }), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
-      isCover: false,
-      align: "both"
-    }, /*#__PURE__*/React.createElement(Loader, null))), getFooter ? /*#__PURE__*/React.createElement(CardFooter, null, getFooter()) : null)))) : null);
+        autoComplete: false,
+        dataId: `${dataId}_search`
+      }))) : null, /*#__PURE__*/React.createElement(CardContent, {
+        shrink: true,
+        customClass: `${!tabletMode && dropBoxSize ? style[dropBoxSize] : ''} ${cardContentClass}`,
+        eleRef: this.suggestionContainerRef
+      }, suggestionGroups.length ? suggestionGroups.map(group => {
+        let {
+          id: groupId,
+          name: groupName,
+          options
+        } = group;
+        let hoverId = suggestionOptionIds[hoverIndex];
+        return /*#__PURE__*/React.createElement(React.Fragment, {
+          key: groupId
+        }, groupName && /*#__PURE__*/React.createElement("div", {
+          className: style.groupTitle
+        }, /*#__PURE__*/React.createElement(DropDownHeading, {
+          text: groupName,
+          a11y: {
+            role: 'heading'
+          }
+        })), /*#__PURE__*/React.createElement(Suggestions, _extends({
+          activeId: selectedId,
+          suggestions: options,
+          getRef: this.suggestionItemRef,
+          hoverId: hoverId,
+          onClick: this.handleChange,
+          onMouseEnter: this.handleMouseEnter,
+          selectedOptions: [selectedId],
+          needTick: needTick,
+          needBorder: false,
+          htmlId: setAriaId,
+          a11y: {
+            ariaParentRole: 'listbox',
+            role: 'option'
+          },
+          dataId: `${dataId}_Options`
+        }, SuggestionsProps)));
+      }) : /*#__PURE__*/React.createElement(EmptyState, {
+        options: revampedGroups,
+        searchString: searchStr,
+        suggestions: suggestionGroups,
+        renderCustomEmptyState: renderCustomEmptyState,
+        dataId: dataIdSrchEmptyMsg,
+        isLoading: isFetchingOptions,
+        i18nKeys: i18nKeys,
+        htmlId: ariaErrorId
+      }), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
+        isCover: false,
+        align: "both"
+      }, /*#__PURE__*/React.createElement(Loader, null))), getFooter ? /*#__PURE__*/React.createElement(CardFooter, null, getFooter()) : null)));
+    }) : null);
   }
 
 }

package/es/Select/Select.js

@@ -325,9 +325,10 @@ export class SelectComponent extends Component {
     needCloseOnSelect && this.handlePopupClose(e);
   }
 
-  responsiveFunc({
-    mediaQueryOR
-  }) {
+  responsiveFunc(_ref) {
+    let {
+      mediaQueryOR
+    } = _ref;
     return {
       tabletMode: mediaQueryOR([{
         maxWidth: 700
@@ -507,7 +508,8 @@ export class SelectComponent extends Component {
     isScrollReachedBottom && this.handleGetNextOptions();
   }
 
-  handleFetchOptions(APICall, searchStr = '') {
+  handleFetchOptions(APICall) {
+    let searchStr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
     // let funcArgs = args.slice(1, args.length);
     let {
       isFetchingOptions = false
@@ -722,13 +724,14 @@ export class SelectComponent extends Component {
     });
   }
 
-  getInputFieldLineA11y({
-    setAriaId,
-    isReadOnly,
-    isDisabled,
-    isPopupOpen,
-    inputFieldLineA11y
-  }) {
+  getInputFieldLineA11y(_ref2) {
+    let {
+      setAriaId,
+      isReadOnly,
+      isDisabled,
+      isPopupOpen,
+      inputFieldLineA11y
+    } = _ref2;
     return {
       tabIndex: 0,
       role: 'button',
@@ -993,104 +996,109 @@ export class SelectComponent extends Component {
     })), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: "Helmet"
-    }, ({
-      tabletMode
-    }) => /*#__PURE__*/React.createElement(ResponsiveDropBox, {
-      animationStyle: animationStyle,
-      boxPosition: position || `${defaultDropBoxPosition}`,
-      getRef: getContainerRef,
-      isActive: isPopupReady,
-      isAnimate: isAnimate && !isVirtualizerEnabled // Note: Virtualizer gets element height at mount itself which causes issue with options height
-      ,
-      isArrow: false,
-      onClick: removeClose,
-      needResponsive: needResponsive,
-      dataId: `${dataId}_suggestions`,
-      size: boxSize,
-      isPadding: false,
-      isResponsivePadding: getFooter ? false : true,
-      alignBox: "row",
-      isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
-      positionsOffset: positionsOffset,
-      targetOffset: targetOffset,
-      isRestrictScroll: isRestrictScroll,
-      portalId: dropBoxPortalId,
-      customClass: {
-        customDropBox: dropBoxClass
-      }
-    }, isLoading ? /*#__PURE__*/React.createElement(Container, {
-      align: "both",
-      className: style.loader
-    }, /*#__PURE__*/React.createElement(Loader, null)) : /*#__PURE__*/React.createElement(React.Fragment, null, !getChildren ? /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, /*#__PURE__*/React.createElement(Card, {
-      onScroll: this.handleScroll
-    }, needSearch ? /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement("div", {
-      className: `${style.search} ${style[size]}`
-    }, /*#__PURE__*/React.createElement(TextBoxIcon, {
-      a11y: {
-        ariaControls: setAriaId,
-        ariaAutocomplete: 'list',
-        ariaDescribedby: ariaErrorId
-      },
-      inputRef: this.searchInputRef,
-      maxLength: maxLength,
-      onChange: this.handleSearch,
-      onKeyDown: this.handleKeyDown,
-      placeHolder: searchBoxPlaceHolder,
-      size: searchBoxSize,
-      value: searchStr,
-      onClear: this.handleClearSearch,
-      dataId: `${dataId}_search`,
-      i18nKeys: TextBoxIcon_i18n,
-      autoComplete: autoComplete,
-      customProps: {
-        TextBoxProps: DropdownSearchTextBoxProps
-      },
-      renderCustomClearComponent: renderCustomSearchClearComponent
-    }))) : null, /*#__PURE__*/React.createElement(CardContent, {
-      shrink: true,
-      customClass: `
+    }, _ref3 => {
+      let {
+        tabletMode
+      } = _ref3;
+      return /*#__PURE__*/React.createElement(ResponsiveDropBox, {
+        animationStyle: animationStyle,
+        boxPosition: position || `${defaultDropBoxPosition}`,
+        getRef: getContainerRef,
+        isActive: isPopupReady,
+        isAnimate: isAnimate && !isVirtualizerEnabled // Note: Virtualizer gets element height at mount itself which causes issue with options height
+        ,
+        isArrow: false,
+        onClick: removeClose,
+        needResponsive: needResponsive,
+        dataId: `${dataId}_suggestions`,
+        size: boxSize,
+        isPadding: false,
+        isResponsivePadding: getFooter ? false : true,
+        alignBox: "row",
+        isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+        positionsOffset: positionsOffset,
+        targetOffset: targetOffset,
+        isRestrictScroll: isRestrictScroll,
+        portalId: dropBoxPortalId,
+        customClass: {
+          customDropBox: dropBoxClass
+        }
+      }, isLoading ? /*#__PURE__*/React.createElement(Container, {
+        align: "both",
+        className: style.loader
+      }, /*#__PURE__*/React.createElement(Loader, null)) : /*#__PURE__*/React.createElement(React.Fragment, null, !getChildren ? /*#__PURE__*/React.createElement(Box, {
+        flexible: true
+      }, /*#__PURE__*/React.createElement(Card, {
+        onScroll: this.handleScroll
+      }, needSearch ? /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement("div", {
+        className: `${style.search} ${style[size]}`
+      }, /*#__PURE__*/React.createElement(TextBoxIcon, {
+        a11y: {
+          ariaControls: setAriaId,
+          ariaAutocomplete: 'list',
+          ariaDescribedby: ariaErrorId
+        },
+        inputRef: this.searchInputRef,
+        maxLength: maxLength,
+        onChange: this.handleSearch,
+        onKeyDown: this.handleKeyDown,
+        placeHolder: searchBoxPlaceHolder,
+        size: searchBoxSize,
+        value: searchStr,
+        onClear: this.handleClearSearch,
+        dataId: `${dataId}_search`,
+        i18nKeys: TextBoxIcon_i18n,
+        autoComplete: autoComplete,
+        customProps: {
+          TextBoxProps: DropdownSearchTextBoxProps
+        },
+        renderCustomClearComponent: renderCustomSearchClearComponent
+      }))) : null, /*#__PURE__*/React.createElement(CardContent, {
+        shrink: true,
+        customClass: `
                               ${!tabletMode && dropBoxSize ? style[dropBoxSize] : ''} ${cardContentClass}`,
-      eleRef: this.suggestionContainerRef
-    }, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, _extends({
-      key: searchStr.trim(),
-      activeId: selectedId,
-      isVirtualizerEnabled: isVirtualizerEnabled,
-      getVirtualizerPublicMethods: this.getVirtualizerPublicMethods,
-      setVirtualizerContainerRefFunction: this.setSuggestionsVirtualizerContainerRefFunction,
-      suggestions: suggestions,
-      getRef: this.suggestionItemRef,
-      hoverOption: hoverIndex,
-      onClick: this.handleChange,
-      onMouseEnter: this.handleMouseEnter,
-      dataId: `${dataId}_Options`,
-      needTick: needTick,
-      needBorder: needListBorder,
-      selectedOptions: [selectedId],
-      className: `${tabletMode ? style.responsivelistItemContainer : style.listItemContainer}`,
-      listItemSize: listItemSize,
-      htmlId: setAriaId,
-      a11y: {
-        ariaParentRole: 'listbox',
-        role: 'option'
-      }
-    }, SuggestionsProps)) : /*#__PURE__*/React.createElement(EmptyState, {
-      isLoading: isFetchingOptions,
-      options: options,
-      searchString: searchStr,
-      suggestions: suggestions,
-      dataId: dataId,
-      renderCustomEmptyState: renderCustomEmptyState,
-      getCustomEmptyState: getCustomEmptyState ? this.handleGetAddNewOptionText : null,
-      i18nKeys: i18nKeys,
-      htmlId: ariaErrorId
-    }), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
-      isCover: false,
-      align: "both"
-    }, /*#__PURE__*/React.createElement(Loader, null))), getFooter ? /*#__PURE__*/React.createElement(CardFooter, null, getFooter()) : null)) : /*#__PURE__*/React.createElement(Box, {
-      flexible: true
-    }, getChildren())))) : null);
+        eleRef: this.suggestionContainerRef
+      }, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, _extends({
+        key: searchStr.trim(),
+        activeId: selectedId,
+        isVirtualizerEnabled: isVirtualizerEnabled,
+        getVirtualizerPublicMethods: this.getVirtualizerPublicMethods,
+        setVirtualizerContainerRefFunction: this.setSuggestionsVirtualizerContainerRefFunction,
+        suggestions: suggestions,
+        getRef: this.suggestionItemRef,
+        hoverOption: hoverIndex,
+        onClick: this.handleChange,
+        onMouseEnter: this.handleMouseEnter,
+        dataId: `${dataId}_Options`,
+        needTick: needTick,
+        needBorder: needListBorder,
+        selectedOptions: [selectedId],
+        className: `${tabletMode ? style.responsivelistItemContainer : style.listItemContainer}`,
+        listItemSize: listItemSize,
+        htmlId: setAriaId,
+        a11y: {
+          ariaParentRole: 'listbox',
+          role: 'option'
+        }
+      }, SuggestionsProps)) : /*#__PURE__*/React.createElement(EmptyState, {
+        isLoading: isFetchingOptions,
+        options: options,
+        searchString: searchStr,
+        suggestions: suggestions,
+        dataId: dataId,
+        renderCustomEmptyState: renderCustomEmptyState,
+        getCustomEmptyState: getCustomEmptyState ? this.handleGetAddNewOptionText : null,
+        i18nKeys: i18nKeys,
+        htmlId: ariaErrorId
+      }), isFetchingOptions && /*#__PURE__*/React.createElement(Container, {
+        isCover: false,
+        align: "both"
+      }, /*#__PURE__*/React.createElement(Loader, null))), getFooter ? /*#__PURE__*/React.createElement(CardFooter, null, getFooter({
+        closePopup: this.handlePopupClose
+      })) : null)) : /*#__PURE__*/React.createElement(Box, {
+        flexible: true
+      }, getChildren())));
+    }) : null);
   }
 
 }