@zohodesk/components 1.4.11 → 1.4.13

package/es/utils/dropDownUtils.js

@@ -1,510 +0,0 @@
-/***** Libraries *****/
-import { createSelector } from 'reselect';
-import { getIsEmptyValue, getSearchString } from "./Common";
-export const dummyArray = [];
-export const dummyObj = {};
-export const getOptions = props => props.options || dummyArray;
-
-const getOptionsOrder = props => props.optionsOrder || dummyArray;
-
-const getLimit = props => props.limit || 0;
-
-const getSelectedOptionsSel = props => props.selectedOptions || dummyArray;
-
-const getSearchStr = props => props.searchStr || '';
-
-export const getValueField = props => props.valueField || '';
-export const getSecondaryField = props => props.secondaryField || '';
-export const getTextField = props => props.textField || '';
-export const getImageField = props => props.imageField || '';
-export const getIconName = props => props.iconName || '';
-export const getIconSize = props => props.iconSize || '';
-export const getOptionType = props => props.optionType || '';
-
-const getNeedSearch = props => props.needSearch;
-
-const getIsDefaultSelectValue = props => props.isDefaultSelectValue;
-
-const getSelectedOptionsLength = props => getIsEmptyValue(props.selectedOptionsLength) ? '' : props.selectedOptionsLength;
-
-const getNormalizedFormatOptions = props => props.normalizedFormatOptions || dummyObj;
-
-const getSelectedValue = props => getIsEmptyValue(props.selectedValue) ? '' : props.selectedValue;
-
-const getSelectedFormatOptions = props => props.selectedFormatOptions || dummyObj;
-
-export const getPrefixText = props => props.prefixText || '';
-
-const getIsStartWithSearch = props => props.isStartsWithSearch;
-
-const getKeepSelectedOptions = props => props.keepSelectedOptions;
-
-const getDisabledOptions = props => props.disabledOptions || dummyArray;
-
-const getListItemProps = props => props.listItemProps || '';
-
-const defaultSearchFields = ['value'];
-
-const getSearchFields = props => {
-  return props.searchFields || defaultSearchFields;
-}; // const isObjectContainsSearchString = (searchFields = [], searchStr = '', obj) => {
-//   const matchedFields = searchFields.filter(element => {
-//     return getSearchString(obj[element]).indexOf(searchStr) !== -1
-//   });
-//   return matchedFields.length !== 0;
-// }
-
-
-const isObjectContainsSearchString = function () {
-  let searchFields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  let searchStr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-  let obj = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  return searchFields.some(field => {
-    const val = obj[field];
-    if (val === null || val === undefined) return false;
-    const str = getSearchString(val);
-    return str && str.indexOf(searchStr) !== -1;
-  });
-};
-
-const getAllowValueFallback = props => props.allowValueFallback !== false;
-
-export const makeGetMultiSelectFilterSuggestions = () => createSelector([getOptions, getSelectedOptionsSel, getSearchStr, getNeedSearch, getIsStartWithSearch, getKeepSelectedOptions, getSearchFields], (options, selectedOptions, searchStr, needSearch, isStartsWithSearch, keepSelectedOptions, searchFields) => {
-  const suggestions = [];
-  const suggestionIds = [];
-  options.forEach(option => {
-    const searchString = getSearchString(searchStr);
-    const {
-      value = ''
-    } = option;
-    const valueString = getSearchString(value);
-    const isMatch = needSearch ? isStartsWithSearch ? valueString.startsWith(searchString) : isObjectContainsSearchString(searchFields, searchString, option) : true;
-
-    if (selectedOptions.indexOf(option.id) === -1 && isMatch || keepSelectedOptions) {
-      suggestions.push(option);
-      suggestionIds.push(option.id);
-    }
-  });
-  return {
-    suggestions,
-    suggestionIds
-  };
-});
-export const optionIdGrouping = (id, prefixText) => {
-  if (getIsEmptyValue(id)) {
-    return '';
-  }
-
-  if (getIsEmptyValue(prefixText)) {
-    return id;
-  }
-
-  const prefixType = typeof prefixText === 'number' ? 'Int' : 'Str';
-  const idType = typeof id === 'number' ? 'Int' : 'Str';
-  return `${prefixType}_${prefixText}_${idType}_${id}`;
-};
-export const extractOptionId = id => {
-  if (getIsEmptyValue(id)) {
-    return {
-      id: ''
-    };
-  }
-
-  if (typeof id === 'number') {
-    return {
-      id
-    };
-  }
-
-  const splitedOption = id.split && id.split('_');
-
-  if (splitedOption.length === 1) {
-    return splitedOption[0];
-  }
-
-  if (splitedOption.length === 4) {
-    let [prefixType, prefixText, idType, id] = splitedOption;
-    id = idType === 'Int' ? Number.parseInt(id) : id;
-    prefixText = prefixType === 'Int' ? Number.parseInt(prefixText) : prefixText;
-    return {
-      id,
-      groupId: prefixText
-    };
-  }
-};
-export const extractOptionIdFromJson = (id, localData) => localData[id] || {};
-export const makeFormatOptions = () => createSelector([getOptions, getValueField, getTextField, getImageField, getPrefixText, getIconName, getIconSize, getOptionType, getDisabledOptions, getListItemProps, getAllowValueFallback, getSearchFields, getSecondaryField], (options, valueField, textField, imageField, prefixText, iconName, iconSize, optionType, disabledOptions, listItemProps, allowValueFallback, searchFields, secondaryField) => {
-  const revampOptions = [];
-  const remvampOptionIds = [];
-  const normalizedAllOptions = {};
-  const normalizedFormatOptions = {};
-  options.forEach(option => {
-    if (!getIsEmptyValue(option)) {
-      //For group multiSelect - grouping selectedOptions case
-      const {
-        valueField: impValueField,
-        textField: impTextField,
-        imageField: impImageField,
-        secondaryField: impSecondaryField,
-        optionType: impOptionType,
-        iconName: impIconName,
-        iconSize: impIconSize,
-        listItemProps: listStyle
-      } = option;
-      let id = typeof option === 'object' ? option[impValueField || valueField] : option;
-      const value = typeof option === 'object' ? option[impTextField || textField] : allowValueFallback ? option : '';
-      const secondaryValue = typeof option === 'object' ? option[impSecondaryField || secondaryField] : '';
-      const photoURL = typeof option === 'object' ? option[impImageField || imageField] : ''; // grouping options (group select/MultiSelect)
-
-      id = !getIsEmptyValue(id) ? optionIdGrouping(id, prefixText) : '';
-      const additionalSearchFieldData = searchFields.reduce((value, item) => {
-        if (typeof option === 'object' && option.hasOwnProperty(item)) {
-          value[item] = option[item];
-        }
-
-        return value;
-      }, {});
-
-      if (remvampOptionIds.indexOf(id) === -1 && !getIsEmptyValue(id) && !getIsEmptyValue(value)) {
-        remvampOptionIds.push(id);
-        const optionDetails = { // ...option,
-          ...additionalSearchFieldData,
-          id,
-          value,
-          secondaryValue,
-          optionType: impOptionType || optionType
-        };
-
-        if (imageField) {
-          optionDetails.photoURL = photoURL;
-        }
-
-        if (impIconName || iconName) {
-          optionDetails.icon = impIconName || iconName;
-        }
-
-        if (impIconSize || iconSize) {
-          optionDetails.iconSize = impIconSize || iconSize;
-        }
-
-        if (disabledOptions.length) {
-          optionDetails.isDisabled = disabledOptions.indexOf(id) >= 0;
-        }
-
-        if (listStyle || listItemProps) {
-          optionDetails.listItemProps = listStyle || listItemProps;
-        }
-
-        normalizedFormatOptions[id] = optionDetails;
-        normalizedAllOptions[id] = { ...option,
-          groupId: prefixText
-        };
-        revampOptions.push(optionDetails);
-      }
-    }
-  });
-  return {
-    allOptions: revampOptions,
-    normalizedAllOptions,
-    normalizedFormatOptions,
-    optionsOrder: remvampOptionIds
-  };
-});
-export const makeGetMultiSelectSelectedOptions = () => createSelector([getSelectedOptionsSel, getNormalizedFormatOptions, getSelectedOptionsLength, getAllowValueFallback, getLimit], (selectedOptions, normalizedFormatOptions, selectedOptionsLength, allowValueFallback, limit) => {
-  let output = [];
-  let revampSelectedOptions = [];
-  let normalizedSelectedOptions = {};
-  selectedOptionsLength = !getIsEmptyValue(selectedOptionsLength) ? selectedOptionsLength : selectedOptions.length;
-
-  for (let i = 0; i < selectedOptionsLength; i++) {
-    const option = selectedOptions[i];
-    const {
-      id
-    } = normalizedFormatOptions[option] || {};
-
-    if (revampSelectedOptions.indexOf(id) === -1 && !getIsEmptyValue(id)) {
-      revampSelectedOptions.push(id);
-      output.push(normalizedFormatOptions[option]);
-      normalizedSelectedOptions[id] = normalizedFormatOptions[option];
-    } else if (allowValueFallback && getIsEmptyValue(id) && !getIsEmptyValue(option) && revampSelectedOptions.indexOf(option) === -1) {
-      //fallback case
-      const newObj = {
-        id: option,
-        value: option
-      };
-      output.push(newObj);
-      normalizedSelectedOptions[option] = newObj;
-      revampSelectedOptions.indexOf(option) === -1 ? revampSelectedOptions.push(option) : null;
-    }
-  }
-
-  if (limit && limit > 0) {
-    output = output.slice(0, limit);
-    revampSelectedOptions = revampSelectedOptions.slice(0, limit);
-    normalizedSelectedOptions = Object.fromEntries(Object.entries(normalizedSelectedOptions).slice(0, limit));
-  }
-
-  return {
-    formatSelectedOptions: output,
-    normalizedSelectedOptions,
-    selectedOptionIds: revampSelectedOptions
-  };
-});
-export const makeGetSelectedValueText = () => createSelector([getOptionsOrder, getNormalizedFormatOptions, getSelectedValue, getSelectedFormatOptions, getIsDefaultSelectValue, getValueField, getTextField], (optionsOrder, normalizedFormatOptions, selectedValue, selectedFormatOptions, isDefaultSelectValue, valueField, textField) => {
-  let selectedValueIndex = optionsOrder.indexOf(selectedValue);
-  let isSelfValueChanged = false;
-
-  if (getIsEmptyValue(selectedValue) && isDefaultSelectValue) {
-    [selectedValue] = optionsOrder;
-    isSelfValueChanged = true;
-  }
-
-  const allOptions = Object.assign({}, selectedFormatOptions, normalizedFormatOptions);
-  const details = allOptions[selectedValue];
-  let hoverIndex = selectedValueIndex !== -1 ? selectedValueIndex : 0;
-  let selectedValueDetails = details ? {
-    [selectedValue]: details
-  } : dummyObj;
-  let {
-    value: selectedValueText = '',
-    id: selectedId
-  } = details || dummyObj; //selectedValue is not included in options case
-
-  if (getIsEmptyValue(selectedId)) {
-    if (typeof selectedValue === 'object') {
-      const id = selectedValue[valueField];
-      const text = selectedValue[textField];
-      selectedValueDetails = {
-        id,
-        value: text
-      };
-      selectedValueText = text;
-      selectedId = id;
-      selectedValueIndex = optionsOrder.indexOf(selectedId);
-      hoverIndex = selectedValueIndex !== -1 ? selectedValueIndex : 0;
-    } else {
-      selectedValueText = selectedValue;
-      selectedId = selectedValue;
-    }
-  }
-
-  return {
-    selected: selectedValueText,
-    hoverIndex,
-    selectedValueDetails,
-    selectedId,
-    isSelfValueChanged
-  };
-});
-
-const getObj1 = props => props.obj1 || dummyObj;
-
-const getObj2 = props => props.obj2 || dummyObj;
-
-export const makeObjectConcat = () => createSelector([getObj1, getObj2], (obj1, obj2) => Object.assign({}, obj1, obj2));
-/***** Group Select *****/
-
-const getGroupedOptions = props => props.groupedOptions || dummyArray;
-
-const getFormatOptions = makeFormatOptions();
-export const makeGetGroupSelectOptions = () => createSelector([getGroupedOptions, getAllowValueFallback], (groupedOptions, allowValueFallback) => {
-  const revampedGroups = [];
-  let allOptionIds = [];
-  let allNormalizedOptions = {}; //all group normalized options
-
-  let allNormalizedFormatOptions = {};
-  const groupIds = [];
-  const normalizedGroupedOptions = {};
-  groupedOptions.forEach(group => {
-    const {
-      options,
-      id: groupId,
-      name,
-      valueField,
-      textField
-    } = group;
-
-    if (!getIsEmptyValue(groupId) && groupIds.indexOf(groupId) === -1) {
-      groupIds.push(groupId);
-      normalizedGroupedOptions[groupId] = group;
-      const {
-        allOptions,
-        normalizedAllOptions,
-        normalizedFormatOptions,
-        optionsOrder
-      } = getFormatOptions({
-        options,
-        valueField,
-        textField,
-        prefixText: groupId,
-        allowValueFallback
-      });
-
-      if (optionsOrder.length) {
-        revampedGroups.push({
-          id: groupId,
-          name,
-          options: allOptions
-        });
-        allOptionIds = [...allOptionIds, ...optionsOrder];
-        allNormalizedOptions = Object.assign({}, allNormalizedOptions, normalizedAllOptions);
-        allNormalizedFormatOptions = Object.assign({}, allNormalizedFormatOptions, normalizedFormatOptions);
-      }
-    }
-  });
-  return {
-    revampedGroups,
-    normalizedAllOptions: allNormalizedOptions,
-    normalizedFormatOptions: allNormalizedFormatOptions,
-    allOptionIds,
-    groupIds,
-    normalizedGroupedOptions
-  };
-});
-
-const getGroups = props => props.revampedGroups;
-
-const getFilterSuggestions = makeGetMultiSelectFilterSuggestions();
-export const makeGetGroupSelectFilterSuggestions = () => createSelector([getGroups, getSearchStr, getNeedSearch, getIsStartWithSearch], (groups, searchStr, needSearch, isStartsWithSearch) => {
-  const suggestionGroups = [];
-  let suggestionOptionIds = [];
-  groups.forEach(group => {
-    const {
-      options
-    } = group;
-    const {
-      suggestions,
-      suggestionIds
-    } = getFilterSuggestions({
-      options,
-      needSearch,
-      searchStr,
-      isStartsWithSearch
-    });
-
-    if (suggestionIds.length) {
-      suggestionGroups.push(Object.assign({}, group, {
-        options: suggestions
-      }));
-      suggestionOptionIds = [...suggestionOptionIds, ...suggestionIds];
-    }
-  });
-  return {
-    suggestionGroups,
-    suggestionOptionIds
-  };
-});
-export const makeGetOptionIdChange = () => createSelector([getOptions, getValueField, getPrefixText, getTextField, getImageField, getIconName, getIconSize, getOptionType], (options, valueField, prefixText, textField, imageField, iconName, iconSize, optionType) => {
-  const newOptions = [];
-  return options.reduce((changedOptions, option) => {
-    let newOption;
-    const id = typeof option === 'object' ? option[valueField] : option;
-
-    if (typeof option === 'object' && !getIsEmptyValue(id)) {
-      newOption = Object.assign({}, option, {
-        [valueField]: optionIdGrouping(id, prefixText),
-        valueField,
-        textField,
-        optionType
-      });
-
-      if (imageField) {
-        newOption.imageField = imageField;
-      }
-
-      changedOptions.push(newOption);
-    } else if (!getIsEmptyValue(id)) {
-      newOption = {
-        id: optionIdGrouping(id, prefixText),
-        text: id,
-        valueField: 'id',
-        textField: 'text',
-        iconName,
-        optionType,
-        iconSize
-      };
-      changedOptions.push(newOption);
-    }
-
-    return changedOptions;
-  }, newOptions);
-});
-export const filterSelectedOptions = function () {
-  let {
-    selectedOptions = dummyArray,
-    propSelectedOptions = dummyArray,
-    disabledOptions = dummyArray,
-    limit
-  } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  // eslint-disable-next-line no-param-reassign
-  selectedOptions = selectedOptions || dummyArray; // eslint-disable-next-line no-param-reassign
-
-  propSelectedOptions = propSelectedOptions || dummyArray; // eslint-disable-next-line no-param-reassign
-
-  disabledOptions = disabledOptions || dummyArray;
-  const newlyAddedOptions = selectedOptions.filter(selectedOption => propSelectedOptions.indexOf(selectedOption) === -1); // eslint-disable-next-line max-len
-
-  const oldValidSelectedOptions = propSelectedOptions.filter(selectedOption => {
-    const isRemoved = selectedOptions.indexOf(selectedOption) === -1;
-    const isDisabled = disabledOptions.indexOf(selectedOption) >= 0;
-
-    if (isDisabled) {
-      return true;
-    } else if (isRemoved) {
-      return false;
-    }
-
-    return true;
-  });
-  const totalSelectedOptions = [...oldValidSelectedOptions, ...newlyAddedOptions];
-
-  if (limit && limit > 0) {
-    if (totalSelectedOptions.length > limit) {
-      return {
-        newSelectedOptions: totalSelectedOptions.slice(0, limit)
-      };
-    }
-  }
-
-  return {
-    newSelectedOptions: totalSelectedOptions
-  };
-};
-export const makeGetIsShowClearIcon = () => createSelector([getSelectedOptionsSel, getDisabledOptions], (selectedOptions, disabledOptions) => {
-  let countForShowClear = 2;
-  let enabledOptionsLength = 0;
-  let isShowClearIcon = selectedOptions.length >= countForShowClear;
-
-  if (disabledOptions.length) {
-    let isHaveEnabledOptions = false;
-    let isAllDisabled = disabledOptions.length === selectedOptions.length;
-
-    if (!isAllDisabled) {
-      isHaveEnabledOptions = selectedOptions.some(option => {
-        let {
-          isDisabled = false
-        } = option || {};
-
-        if (!isDisabled) {
-          enabledOptionsLength += 1;
-
-          if (enabledOptionsLength === countForShowClear) {
-            return true;
-          }
-
-          return false;
-        }
-
-        return false;
-      });
-    }
-
-    return {
-      isShowClearIcon: isAllDisabled ? !isAllDisabled : isHaveEnabledOptions
-    };
-  }
-
-  return {
-    isShowClearIcon
-  };
-});

package/es/utils/dummyFunction.js

@@ -1 +0,0 @@
-export const dummyFunction = () => {};

package/es/utils/getHTMLFontSize.js

@@ -1,4 +0,0 @@
-export function getHTMLFontSize() {
-  let fontSizePixel = window.getComputedStyle(document.documentElement).fontSize;
-  return parseFloat(fontSizePixel) || 16;
-}

package/es/utils/getInitial.js

@@ -1,24 +0,0 @@
-export function getInitial() {
-  let firstName = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-  let lastName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-  let initial = '';
-
-  if (firstName) {
-    firstName = firstName.trim();
-    initial = firstName[0];
-  }
-
-  if (lastName) {
-    lastName = lastName.trim();
-    initial += initial ? lastName[0] : lastName.substring(0, 2);
-  }
-
-  return initial ? initial.toUpperCase() : initial;
-}
-export function getInitialByPattern(firstName, lastName, pattern) {
-  if (pattern[0] === 'FIRST_NAME') {
-    return getInitial(firstName, lastName);
-  }
-
-  return getInitial(lastName, firstName);
-}

package/es/utils/index.js

@@ -1 +0,0 @@
-export { stopAllEventPropagation, capitalize, getFullName, bytesToSize, getMemSize, checkIsImageFile, getFullDateString, format12Hour, getDateOnly, doAfterScrollEnd, debounce, throttle, getElementSpace, getSearchString, findScrollEnd, isTextSelected } from "./Common";

package/es/utils/scrollTo.js

@@ -1,13 +0,0 @@
-export const scrollTo = function (suggestionContainer, selSuggestion) {
-  if (selSuggestion && suggestionContainer) {
-    if (suggestionContainer.scrollHeight === selSuggestion.offsetTop + selSuggestion.offsetHeight) {
-      suggestionContainer.scrollTop = selSuggestion.offsetTop - selSuggestion.offsetHeight;
-    } else if (selSuggestion.offsetTop === 0) {
-      suggestionContainer.scrollTop = 0;
-    } else if (suggestionContainer.offsetHeight + suggestionContainer.scrollTop < selSuggestion.offsetTop) {
-      suggestionContainer.scrollTop = selSuggestion.offsetTop - selSuggestion.offsetHeight;
-    } else if (suggestionContainer.scrollTop > selSuggestion.offsetTop) {
-      suggestionContainer.scrollTop = selSuggestion.offsetTop - selSuggestion.offsetHeight;
-    }
-  }
-};

package/es/utils/shallowEqual.js

@@ -1,32 +0,0 @@
-function is(x, y) {
-  if (x === y) {
-    return x !== 0 || y !== 0 || 1 / x === 1 / y;
-  } else {
-    return x !== x && y !== y;
-  }
-}
-
-export default function shallowEqual(objA, objB) {
-  if (is(objA, objB)) {
-    return true;
-  }
-
-  if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
-    return false;
-  }
-
-  const keysA = Object.keys(objA);
-  const keysB = Object.keys(objB);
-
-  if (keysA.length !== keysB.length) {
-    return false;
-  }
-
-  for (let i = 0; i < keysA.length; i++) {
-    if (!Object.prototype.hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {
-      return false;
-    }
-  }
-
-  return true;
-}

package/es/v1/Accordion/Accordion.js

@@ -1,66 +0,0 @@
-import React, { useState } from 'react';
-import { useEffectCallOnlyAfterState } from '@zohodesk/hooks';
-import { Accordion_defaultProps } from "./props/defaultProps";
-import { Accordion_propTypes } from "./props/propTypes";
-export default function Accordion(props) {
-  const {
-    className,
-    height,
-    unMount,
-    disableInternalState,
-    selectedItem: propSelectedItem,
-    a11y,
-    dataId,
-    dataSelectorId,
-    onSelect,
-    children
-  } = props;
-  const {
-    role,
-    ariaExpanded,
-    ariaHaspopup
-  } = a11y;
-  const [selectedItem, setSelectedItem] = useState(propSelectedItem);
-
-  function selectMenu(selectedItem) {
-    if (onSelect) {
-      onSelect(selectedItem);
-    }
-
-    !disableInternalState && setSelectedItem(selectedItem);
-  }
-
-  useEffectCallOnlyAfterState(() => {
-    if (!disableInternalState) {
-      setSelectedItem(propSelectedItem);
-    }
-  }, [propSelectedItem]);
-  let renderChildren = React.Children.map(children, child => {
-    if (child) {
-      return /*#__PURE__*/React.cloneElement(child, {
-        selectedItem: disableInternalState ? propSelectedItem : selectedItem,
-        selectMenu: selectMenu,
-        unMount: unMount
-      });
-    }
-  });
-  return /*#__PURE__*/React.createElement("div", {
-    className: className ? className : '',
-    style: {
-      height
-    },
-    role: role,
-    "aria-expanded": ariaExpanded,
-    "aria-haspopup": ariaHaspopup,
-    "data-id": dataId,
-    "data-test-id": dataId,
-    "data-selector-id": dataSelectorId
-  }, renderChildren);
-}
-Accordion.propTypes = Accordion_propTypes;
-Accordion.defaultProps = Accordion_defaultProps; // if (__DOCS__) {
-//   Accordion.docs = {
-//     componentGroup: 'Animation',
-//     folderName: 'Style Guide'
-//   };
-// }