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

package/es/MultiSelect/AdvancedMultiSelect.js

@@ -83,9 +83,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
     return suggestions;
   }
 
-  handleChange() {
-    let selectedOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-    let e = arguments.length > 1 ? arguments[1] : undefined;
+  handleChange(selectedOptions = [], e) {
     const {
       optionsNormalize,
       searchStr
@@ -333,10 +331,9 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
     });
   }
 
-  responsiveFunc(_ref) {
-    let {
-      mediaQueryOR
-    } = _ref;
+  responsiveFunc({
+    mediaQueryOR
+  }) {
     return {
       tabletMode: mediaQueryOR([{
         maxWidth: 700
@@ -514,79 +511,76 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
     }))) : null))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: "Helmet"
-    }, _ref2 => {
-      let {
-        tabletMode
-      } = _ref2;
-      return /*#__PURE__*/React.createElement(ResponsiveDropBox, _extends({
-        animationStyle: animationStyle,
-        boxPosition: position || `${defaultDropBoxPosition}Center`,
-        getRef: getContainerRef,
-        isActive: isPopupReady,
-        isAnimate: isAnimate,
-        isArrow: false,
-        onClick: removeClose,
-        isPadding: false,
-        isBoxPaddingNeed: isBoxPaddingNeed,
-        htmlId: setAriaId,
-        a11y: {
-          role: 'listbox',
-          ariaMultiselectable: true
-        },
-        dataId: `${dataIdMultiSelectComp}_dropbox`,
-        isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
-        positionsOffset: positionsOffset,
-        targetOffset: targetOffset,
-        isRestrictScroll: isRestrictScroll
-      }, DropBoxProps, {
-        alignBox: "row",
-        isResponsivePadding: getFooter ? false : true
-      }), 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
-      }, needSelectAll && !(limit >= 0) ? /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement(MultiSelectHeader, {
-        onSelect: this.handleSelectAll,
-        selectAllText: selectAllText,
-        suggestions: suggestions,
-        dataId: dataIdSelectAllEle
-      })) : null, /*#__PURE__*/React.createElement(CardContent, {
-        shrink: true,
-        customClass: !tabletMode && dropBoxSize ? style[dropBoxSize] : '',
-        eleRef: this.suggestionContainerRef
-      }, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, _extends({
-        suggestions: suggestions,
-        selectedOptions: allselectedOptionIds,
-        getRef: this.suggestionItemRef,
-        hoverOption: hoverOption,
-        onClick: this.handleSelectOption,
-        onMouseEnter: this.handleMouseEnter,
-        needTick: true,
-        listItemSize: listItemSize,
-        a11y: {
-          role: 'option'
-        },
-        dataId: `${dataIdMultiSelectComp}_Options`,
-        limit: limit,
-        limitReachedMessage: limitReachedMessage
-      }, SuggestionsProps)) : /*#__PURE__*/React.createElement(EmptyState, {
-        isLoading: isFetchingOptions,
-        options: options,
-        searchString: searchStr,
-        suggestions: suggestions,
-        renderCustomEmptyState: renderCustomEmptyState,
-        dataId: dataIdLoading,
-        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);
+    }, ({
+      tabletMode
+    }) => /*#__PURE__*/React.createElement(ResponsiveDropBox, _extends({
+      animationStyle: animationStyle,
+      boxPosition: position || `${defaultDropBoxPosition}Center`,
+      getRef: getContainerRef,
+      isActive: isPopupReady,
+      isAnimate: isAnimate,
+      isArrow: false,
+      onClick: removeClose,
+      isPadding: false,
+      isBoxPaddingNeed: isBoxPaddingNeed,
+      htmlId: setAriaId,
+      a11y: {
+        role: 'listbox',
+        ariaMultiselectable: true
+      },
+      dataId: `${dataIdMultiSelectComp}_dropbox`,
+      isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+      positionsOffset: positionsOffset,
+      targetOffset: targetOffset,
+      isRestrictScroll: isRestrictScroll
+    }, DropBoxProps, {
+      alignBox: "row",
+      isResponsivePadding: getFooter ? false : true
+    }), 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
+    }, needSelectAll && !(limit >= 0) ? /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement(MultiSelectHeader, {
+      onSelect: this.handleSelectAll,
+      selectAllText: selectAllText,
+      suggestions: suggestions,
+      dataId: dataIdSelectAllEle
+    })) : null, /*#__PURE__*/React.createElement(CardContent, {
+      shrink: true,
+      customClass: !tabletMode && dropBoxSize ? style[dropBoxSize] : '',
+      eleRef: this.suggestionContainerRef
+    }, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, _extends({
+      suggestions: suggestions,
+      selectedOptions: allselectedOptionIds,
+      getRef: this.suggestionItemRef,
+      hoverOption: hoverOption,
+      onClick: this.handleSelectOption,
+      onMouseEnter: this.handleMouseEnter,
+      needTick: true,
+      listItemSize: listItemSize,
+      a11y: {
+        role: 'option'
+      },
+      dataId: `${dataIdMultiSelectComp}_Options`,
+      limit: limit,
+      limitReachedMessage: limitReachedMessage
+    }, SuggestionsProps)) : /*#__PURE__*/React.createElement(EmptyState, {
+      isLoading: isFetchingOptions,
+      options: options,
+      searchString: searchStr,
+      suggestions: suggestions,
+      renderCustomEmptyState: renderCustomEmptyState,
+      dataId: dataIdLoading,
+      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/MultiSelect/MultiSelect.js

@@ -613,11 +613,7 @@ export class MultiSelectComponent extends React.Component {
     }
   }
 
-  handleFetchOptions() {
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
+  handleFetchOptions(...args) {
     const [APICall, searchStr] = args;
     const {
       isFetchingOptions
@@ -683,9 +679,7 @@ export class MultiSelectComponent extends React.Component {
     });
   }
 
-  handleClickSelectedOption() {
-    let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    let e = arguments.length > 1 ? arguments[1] : undefined;
+  handleClickSelectedOption(id = '', e) {
     const {
       selectedOptions
     } = this.props;
@@ -761,9 +755,7 @@ export class MultiSelectComponent extends React.Component {
     isNextOptions && getNextOptions && this.handleFetchOptions(getNextOptions, searchStr);
   }
 
-  handleChange() {
-    let selectedOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-    let e = arguments.length > 1 ? arguments[1] : undefined;
+  handleChange(selectedOptions = [], e) {
     const {
       optionsNormalize
     } = this.state;
@@ -912,8 +904,7 @@ export class MultiSelectComponent extends React.Component {
     this.suggestionContainer && refFunc(this.suggestionContainer);
   }
 
-  getSelectionUI() {
-    let isResponsive = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  getSelectionUI(isResponsive = false) {
     let {
       size,
       needBorder,

package/es/MultiSelect/Suggestions.js

@@ -14,12 +14,11 @@ import { Container, Box } from "../Layout";
 import { DUMMY_OBJECT, DUMMY_ARRAY } from "../utils/Common";
 import { renderNode } from '@zohodesk/utils';
 
-function SuggestionsVirtualizerContainer(_ref) {
-  let {
-    eleRef,
-    children,
-    setVirtualizerContainerRefFunction
-  } = _ref;
+function SuggestionsVirtualizerContainer({
+  eleRef,
+  children,
+  setVirtualizerContainerRefFunction
+}) {
   useMemo(() => {
     typeof setVirtualizerContainerRefFunction === 'function' && setVirtualizerContainerRefFunction(eleRef);
   }, [eleRef, setVirtualizerContainerRefFunction]);
@@ -33,12 +32,11 @@ export default class Suggestions extends React.PureComponent {
     this.renderVirtualizerSuggestionListItem = this.renderVirtualizerSuggestionListItem.bind(this);
   }
 
-  renderSuggestionList(_ref2) {
-    let {
-      suggestion,
-      index,
-      ref
-    } = _ref2;
+  renderSuggestionList({
+    suggestion,
+    index,
+    ref
+  }) {
     const {
       getRef,
       hoverOption,
@@ -170,11 +168,10 @@ export default class Suggestions extends React.PureComponent {
     }));
   }
 
-  renderVirtualizerSuggestionListItem(_ref3) {
-    let {
-      index,
-      ref
-    } = _ref3;
+  renderVirtualizerSuggestionListItem({
+    index,
+    ref
+  }) {
     const {
       suggestions
     } = this.props;

package/es/Popup/Popup.js

@@ -5,10 +5,7 @@ import { DUMMY_ARRAY, DUMMY_OBJECT } from "./../utils/Common.js";
 import Registry from '@zohodesk/dotkit/es/react/components/Popup/Registry.js';
 global.closeGroupPopups = Registry.closeAllPopupsInGroup;
 
-const Popup = function (Component) {
-  let group = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'global';
-  let needResizeHandling = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
-  let options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : DUMMY_OBJECT;
+const Popup = (Component, group = 'global', needResizeHandling = true, options = DUMMY_OBJECT) => {
   const {
     isAbsolutePositioningNeeded = true,
     isArrow = false,

package/es/Provider/IdProvider.js

@@ -30,11 +30,10 @@ function getDeletedIndexes() {
   return deletedIndexes;
 }
 
-function callback(_ref) {
-  let {
-    globalId,
-    deletedIndexes
-  } = _ref;
+function callback({
+  globalId,
+  deletedIndexes
+}) {
   setGlobalId(globalId);
   setDeletedIndexes(deletedIndexes);
 }

package/es/Provider/LibraryContext.js

@@ -3,18 +3,18 @@ import PropTypes from 'prop-types';
 import LibraryContextInit from "./LibraryContextInit";
 import { getLibraryConfig } from "./Config";
 
-const LibraryContextProvider = _ref => {
-  let {
-    isReducedMotion,
-    direction,
-    coloredTagVariant,
-    hasTagColorInheritedToText,
-    shouldIndicateSwitchState,
-    shouldStrikeThroughDisabledButton,
-    labelRequiredType,
-    shouldHighlightRequiredLabel,
-    children
-  } = _ref;
+const LibraryContextProvider = ({
+  isReducedMotion,
+  direction,
+  coloredTagVariant,
+  hasTagColorInheritedToText,
+  shouldIndicateSwitchState,
+  shouldStrikeThroughDisabledButton,
+  labelRequiredType,
+  shouldHighlightRequiredLabel,
+  children,
+  buttonComponentVersion
+}) => {
   const [value, setValue] = useState({
     isReducedMotion,
     direction,
@@ -22,6 +22,7 @@ const LibraryContextProvider = _ref => {
     hasTagColorInheritedToText,
     shouldIndicateSwitchState,
     shouldStrikeThroughDisabledButton,
+    buttonComponentVersion,
     labelRequiredType,
     shouldHighlightRequiredLabel
   });
@@ -49,6 +50,7 @@ LibraryContextProvider.propTypes = {
   direction: PropTypes.string,
   shouldIndicateSwitchState: PropTypes.bool,
   shouldStrikeThroughDisabledButton: PropTypes.bool,
+  buttonComponentVersion: PropTypes.oneOf(['default', 'v1']),
   labelRequiredType: PropTypes.oneOf(['asterisk', 'text']),
   shouldHighlightRequiredLabel: PropTypes.bool
 };
@@ -59,6 +61,7 @@ LibraryContextProvider.defaultProps = {
   hasTagColorInheritedToText: true,
   shouldIndicateSwitchState: false,
   shouldStrikeThroughDisabledButton: false,
+  buttonComponentVersion: 'v1',
   labelRequiredType: 'asterisk',
   shouldHighlightRequiredLabel: true
 };

package/es/Provider/NumberGenerator/NumberGenerator.js

@@ -50,14 +50,13 @@ export function decreaseGlobalIds(numbers, deletedIndexes, globalId) {
     deletedIndexes
   };
 }
-export function useNumberGenerator(_ref) {
-  let {
-    getGlobalId,
-    prefix,
-    getGlobalPrefix,
-    getDeletedIndexes,
-    callback
-  } = _ref;
+export function useNumberGenerator({
+  getGlobalId,
+  prefix,
+  getGlobalPrefix,
+  getDeletedIndexes,
+  callback
+}) {
   let presentValues = useRef([]),
       presentIndex = useRef(0);
   prefix = typeof prefix === 'undefined' ? '' : `${prefix}_`;
@@ -84,15 +83,14 @@ export function useNumberGenerator(_ref) {
   presentIndex.current = -1;
   return getNextId;
 }
-export function getNumberGenerators(_ref2) {
-  let {
-    Component,
-    prefix,
-    getGlobalPrefix,
-    getGlobalId,
-    getDeletedIndexes,
-    callback
-  } = _ref2;
+export function getNumberGenerators({
+  Component,
+  prefix,
+  getGlobalPrefix,
+  getGlobalId,
+  getDeletedIndexes,
+  callback
+}) {
   let presentIndex = 0,
       presentValues = [],
       {

package/es/Provider/ZindexProvider.js

@@ -27,11 +27,10 @@ function getDeletedIndexes() {
   return deletedIndexes;
 }
 
-function callback(_ref) {
-  let {
-    globalId,
-    deletedIndexes
-  } = _ref;
+function callback({
+  globalId,
+  deletedIndexes
+}) {
   setInitialZIndex(globalId);
   setDeletedIndexes(deletedIndexes);
 }

package/es/Responsive/CustomResponsive.js

@@ -94,9 +94,7 @@ ResponsiveSender.defaultProps = { ...CustomResponsiveSender_defaultProps,
 };
 ResponsiveSender.contextType = ResponsiveContext;
 ResponsiveSender.propTypes = CustomResponsiveSender_propTypes;
-export function useResponsiveReceiver() {
-  let responsiveId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultResponsiveId;
-  let query = arguments.length > 1 ? arguments[1] : undefined;
+export function useResponsiveReceiver(responsiveId = defaultResponsiveId, query) {
   const [, forceUpdate] = useState();
   const totalContextData = useContext(ResponsiveContext);
   const validSizeContextData = totalContextData[validSizeResponsiveId];
@@ -174,14 +172,13 @@ export function useResponsiveReceiver() {
   updateLatestData();
   return data.current;
 }
-export function ResponsiveReceiver(_ref) {
-  let {
-    children,
-    responsiveId,
-    query,
-    eleRef,
-    domRefKey
-  } = _ref;
+export function ResponsiveReceiver({
+  children,
+  responsiveId,
+  query,
+  eleRef,
+  domRefKey
+}) {
   const data = useResponsiveReceiver(responsiveId, query);
   const child = children(data);
   return eleRef ? /*#__PURE__*/React.createElement(DOMRefWrapper, {

package/es/Responsive/ResizeComponent.js

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

package/es/Responsive/Responsive.js

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

package/es/Responsive/sizeObservers.js

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

package/es/ResponsiveDropBox/ResponsiveDropBox.js

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