@zohodesk/components 1.6.0 → 1.6.2

package/es/v1/MultiSelect/props/propTypes.js

@@ -1,322 +0,0 @@
-import PropTypes from 'prop-types';
-export const EmptyState_propTypes = {
-  dataId: PropTypes.string,
-  emptyMessage: PropTypes.string,
-  getCustomEmptyState: PropTypes.func,
-  i18nKeys: PropTypes.shape({
-    loadingText: PropTypes.string,
-    emptyText: PropTypes.string,
-    noMoreText: PropTypes.string,
-    searchEmptyText: PropTypes.string
-  }),
-  palette: PropTypes.oneOf(['default', 'dark']),
-  isLoading: PropTypes.bool,
-  noMoreOptionsMessage: PropTypes.string,
-  options: PropTypes.array,
-  searchEmptyMessage: PropTypes.string,
-  searchString: PropTypes.string,
-  suggestions: PropTypes.array,
-  htmlId: PropTypes.string,
-  a11y: PropTypes.shape({
-    role: PropTypes.string
-  })
-};
-export const MultiSelect_propTypes = {
-  animationStyle: PropTypes.string,
-  autoComplete: PropTypes.bool,
-  borderColor: PropTypes.oneOf(['transparent', 'default', 'dark']),
-  closePopupOnly: PropTypes.func,
-  dataId: PropTypes.string,
-  defaultDropBoxPosition: PropTypes.oneOf(['bottom', 'top', 'left', 'right']),
-  disableAction: PropTypes.bool,
-  dropBoxSize: PropTypes.oneOf(['small', 'medium', 'large']),
-  emptyMessage: PropTypes.string.isRequired,
-  getContainerRef: PropTypes.func,
-  getNextOptions: PropTypes.func,
-  getPublicMethods: PropTypes.func,
-  getRef: PropTypes.func,
-  getTargetRef: PropTypes.func,
-  i18nKeys: PropTypes.shape({
-    clearText: PropTypes.string,
-    loadingText: PropTypes.string,
-    emptyText: PropTypes.string,
-    noMoreText: PropTypes.string,
-    searchEmptyText: PropTypes.string
-  }),
-  a11y: PropTypes.shape({
-    clearLabel: PropTypes.string
-  }),
-  isAnimate: PropTypes.bool,
-  isBoxPaddingNeed: PropTypes.bool,
-  isDisabled: PropTypes.bool,
-  isNextOptions: PropTypes.bool,
-  isPopupOpen: PropTypes.bool,
-  isPopupOpenOnEnter: PropTypes.bool,
-  isPopupReady: PropTypes.bool,
-  isReadOnly: PropTypes.bool,
-  isSearchClearOnClose: PropTypes.bool,
-  isSearching: PropTypes.bool,
-  needAutoFocus: PropTypes.bool,
-  needBorder: PropTypes.bool,
-  needLocalSearch: PropTypes.bool,
-  needResponsive: PropTypes.bool,
-  needToCloseOnSelect: PropTypes.bool,
-  //For Group multiSelect
-  noMoreOptionsMessage: PropTypes.string,
-  onChange: PropTypes.func.isRequired,
-  onDropBoxClose: PropTypes.func,
-  onDropBoxOpen: PropTypes.func,
-  onFocus: PropTypes.func,
-  onKeyDown: PropTypes.func,
-  onSearch: PropTypes.func,
-  openPopupOnly: PropTypes.func,
-  options: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    text: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
-  }))]).isRequired,
-  palette: PropTypes.oneOf(['default', 'dark']),
-  placeHolder: PropTypes.string,
-  position: PropTypes.string,
-  prefixText: PropTypes.string,
-  removeClose: PropTypes.func,
-  searchDebounceTime: PropTypes.number,
-  searchEmptyMessage: PropTypes.string,
-  selectedOptions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])).isRequired,
-  size: PropTypes.oneOf(['medium', 'xmedium']),
-  textBoxClass: PropTypes.string,
-  textBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
-  textField: PropTypes.string,
-  title: PropTypes.string,
-  togglePopup: PropTypes.func,
-  valueField: PropTypes.string,
-  variant: PropTypes.string,
-  htmlId: PropTypes.string,
-  isSearchClearOnSelect: PropTypes.bool,
-  children: PropTypes.node,
-  customChildrenClass: PropTypes.string,
-  disabledOptions: PropTypes.arrayOf(PropTypes.string),
-  getFooter: PropTypes.func,
-  needEffect: PropTypes.bool,
-  boxSize: PropTypes.string,
-  isAbsolutePositioningNeeded: PropTypes.bool,
-  isRestrictScroll: PropTypes.bool,
-  positionsOffset: PropTypes.object,
-  targetOffset: PropTypes.object,
-  isLoading: PropTypes.bool,
-  dataSelectorId: PropTypes.string,
-  keepSelectedOptions: PropTypes.bool,
-  needSelectAll: PropTypes.bool,
-  selectAllText: PropTypes.string,
-  setAriaId: PropTypes.string,
-  ariaErrorId: PropTypes.string
-};
-export const MultiSelectHeader_propTypes = {
-  dataId: PropTypes.string,
-  onSelect: PropTypes.func,
-  selectAllText: PropTypes.string,
-  suggestions: PropTypes.array
-};
-export const MultiSelectWithAvatar_propTypes = {
-  options: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    text: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    photoURL: PropTypes.string
-  }))]).isRequired,
-  imageField: PropTypes.string,
-  customProps: PropTypes.shape({
-    SuggestionsProps: PropTypes.object,
-    DropBoxProps: PropTypes.object
-  }),
-  ...MultiSelect_propTypes
-};
-export const SelectedOptions_propTypes = {
-  getRef: PropTypes.func,
-  highLightedSelectOptions: PropTypes.array,
-  isReadOnly: PropTypes.bool,
-  onRemove: PropTypes.func,
-  onSelect: PropTypes.func,
-  selectedOptions: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    photoURL: PropTypes.string,
-    logo: PropTypes.string,
-    optionType: PropTypes.string
-  })),
-  size: PropTypes.oneOf(['medium', 'xmedium']),
-  palette: PropTypes.string,
-  dataId: PropTypes.string
-};
-export const Suggestions_propTypes = {
-  a11y: PropTypes.shape({
-    ariaParentRole: PropTypes.string,
-    ariaMultiselectable: PropTypes.bool
-  }),
-  activeId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  avatarPalette: PropTypes.string,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  getRef: PropTypes.func,
-  hoverId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  hoverOption: PropTypes.number,
-  listItemSize: PropTypes.oneOf(['small', 'medium', 'large']),
-  needBorder: PropTypes.bool,
-  needTick: PropTypes.bool,
-  onClick: PropTypes.func,
-  onMouseEnter: PropTypes.func,
-  palette: PropTypes.string,
-  selectedOptions: PropTypes.array,
-  htmlId: PropTypes.string,
-  suggestions: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    photoURL: PropTypes.string,
-    logo: PropTypes.string,
-    optionType: PropTypes.string,
-    listItemProps: PropTypes.object
-  }))
-};
-export const AdvancedGroupMultiSelect_propTypes = {
-  animationStyle: PropTypes.string,
-  autoComplete: PropTypes.bool,
-  borderColor: PropTypes.oneOf(['transparent', 'default']),
-  customClass: PropTypes.string,
-  dataId: PropTypes.string,
-  defaultDropBoxPosition: PropTypes.oneOf(['bottom', 'top', 'left', 'right']),
-  dropBoxSize: PropTypes.oneOf(['small', 'medium', 'large']),
-  emptyMessage: PropTypes.string.isRequired,
-  getContainerRef: PropTypes.func,
-  getFooter: PropTypes.func,
-  groupedOptions: PropTypes.array.isRequired,
-  i18nKeys: PropTypes.shape({
-    loadingText: PropTypes.string,
-    emptyText: PropTypes.string,
-    noMoreText: PropTypes.string,
-    searchEmptyText: PropTypes.string
-  }),
-  a11y: PropTypes.shape({
-    clearLabel: PropTypes.string
-  }),
-  isDataLoaded: PropTypes.bool,
-  isDisabled: PropTypes.bool,
-  isPadding: PropTypes.bool,
-  isPopupOpen: PropTypes.bool,
-  isPopupReady: PropTypes.bool,
-  isReadOnly: PropTypes.bool,
-  listItemSize: PropTypes.oneOf(['small', 'medium', 'large']),
-  needBorder: PropTypes.bool,
-  needResponsive: PropTypes.bool,
-  needSelectAll: PropTypes.bool,
-  notifyPopupToggle: PropTypes.func,
-  onFocus: PropTypes.func,
-  onKeyDown: PropTypes.func,
-  onSearch: PropTypes.func,
-  placeHolder: PropTypes.string,
-  position: PropTypes.string,
-  removeClose: PropTypes.func,
-  searchDebounceTime: PropTypes.number,
-  searchEmptyMessage: PropTypes.string,
-  selectAllText: PropTypes.string,
-  selectedGroupOptions: PropTypes.array.isRequired,
-  selectedOptionDetails: PropTypes.object,
-  size: PropTypes.oneOf(['medium', 'xmedium']),
-  textBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
-  title: PropTypes.string,
-  variant: PropTypes.string,
-  htmlId: PropTypes.string,
-  isSearchClearOnSelect: PropTypes.bool,
-  palette: PropTypes.oneOf(['default', 'dark']),
-  needEffect: true,
-  dataSelectorId: PropTypes.string,
-  valueField: PropTypes.string,
-  textField: PropTypes.string,
-  getTargetRef: PropTypes.func,
-  togglePopup: PropTypes.func,
-  isAbsolutePositioningNeeded: PropTypes.bool,
-  isRestrictScroll: PropTypes.bool,
-  positionsOffset: PropTypes.object,
-  targetOffset: PropTypes.object,
-  needLocalSearch: PropTypes.bool,
-  isNextOptions: PropTypes.bool,
-  getNextOptions: PropTypes.func,
-  isPopupOpenOnEnter: PropTypes.bool,
-  onChange: PropTypes.func,
-  needToCloseOnSelect: PropTypes.func,
-  searchStr: PropTypes.string,
-  children: PropTypes.node,
-  dataSelectorId: PropTypes.string
-};
-export const AdvancedMultiSelect_propTypes = { ...MultiSelect_propTypes,
-  selectedOptionDetails: PropTypes.string,
-  iconSize: PropTypes.string,
-  id: PropTypes.string.isRequired,
-  options: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    text: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    photoURL: PropTypes.string
-  }))]).isRequired,
-  selectedOptions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])).isRequired,
-  selectedOptionsLimit: PropTypes.number,
-  getSelectedOptionDetails: PropTypes.func,
-  emptyMessage: PropTypes.string.isRequired,
-  isDisabled: PropTypes.bool,
-  isReadOnly: PropTypes.bool,
-  needLocalSearch: PropTypes.bool,
-  needSelectAll: PropTypes.bool,
-  onChange: PropTypes.func.isRequired,
-  searchEmptyMessage: PropTypes.string,
-  placeHolder: PropTypes.string,
-  selectAllText: PropTypes.string,
-  textField: PropTypes.string,
-  valueField: PropTypes.string,
-  imageField: PropTypes.string,
-  iconName: PropTypes.string,
-  prefixText: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  //For grouping multiSelect
-  optionType: PropTypes.oneOf(['default', 'avatar', 'icon']),
-  needEffect: PropTypes.bool,
-  animationStyle: PropTypes.string,
-  defaultDropBoxPosition: PropTypes.oneOf(['bottom', 'top', 'left', 'right']),
-  dropBoxSize: PropTypes.oneOf(['small', 'medium', 'large']),
-  isAnimate: PropTypes.bool,
-  size: PropTypes.oneOf(['medium', 'xmedium']),
-  textBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
-  title: PropTypes.string,
-  variant: PropTypes.string,
-  dataIdClearIcon: PropTypes.string,
-  dataIdLoading: PropTypes.string,
-  dataIdMultiSelectComp: PropTypes.string,
-  dataIdSelectAllEle: PropTypes.string,
-
-  /**** Popup Props ****/
-  isPopupOpen: PropTypes.bool,
-  isPopupReady: PropTypes.bool,
-  togglePopup: PropTypes.func,
-  getContainerRef: PropTypes.func,
-  position: PropTypes.string,
-  removeClose: PropTypes.func,
-  listItemSize: PropTypes.oneOf(['small', 'medium', 'large']),
-  needBorder: PropTypes.bool,
-  htmlId: PropTypes.string,
-  i18nKeys: PropTypes.shape({
-    clearText: PropTypes.string,
-    loadingText: PropTypes.string,
-    emptyText: PropTypes.string,
-    noMoreText: PropTypes.string,
-    searchEmptyText: PropTypes.string
-  }),
-  a11y: PropTypes.shape({
-    clearLabel: PropTypes.string
-  }),
-  borderColor: PropTypes.oneOf(['transparent', 'default', 'dark']),
-  isBoxPaddingNeed: PropTypes.bool,
-  isSearchClearOnSelect: PropTypes.bool,
-  disabledOptions: PropTypes.arrayOf(PropTypes.string),
-  getFooter: PropTypes.func,
-  customProps: PropTypes.shape({
-    SuggestionsProps: PropTypes.object,
-    DropBoxProps: PropTypes.object
-  }),
-  isLoading: PropTypes.bool,
-  dataSelectorId: PropTypes.string,
-  customClass: PropTypes.object
-};

package/es/v1/PopOver/PopOver.js

@@ -1,176 +0,0 @@
-import React, { useRef } from 'react';
-import { useEffectCallOnlyAfterState } from '@zohodesk/hooks';
-import { PopOver_defaultProps, PopOverContainer_defaultProps } from "./props/defaultProps";
-import { PopOver_propTypes, PopOverTarget_propTypes, PopOverContainer_propTypes } from "./props/propTypes";
-import Popup from "../Popup/Popup";
-import { Box } from "../Layout";
-import ResponsiveDropBox from "../ResponsiveDropBox/ResponsiveDropBox";
-import style from "../../PopOver/PopOver.module.css";
-
-function PopOver(props) {
-  let {
-    children,
-    isPopupOpen,
-    removeClose,
-    right,
-    left,
-    top,
-    bottom,
-    arrowRight,
-    arrowLeft,
-    arrowTop,
-    arrowBottom,
-    isAnimate,
-    isArrow,
-    arrowPosition,
-    position,
-    size,
-    onClick,
-    isPopupReady,
-    getTargetRef,
-    getContainerRef,
-    boxPosition,
-    onPopupOpen,
-    onPopupClose
-  } = props;
-  const popOverTarget = useRef(null);
-  const popOverContainer = useRef(null);
-
-  const popOverTargetRef = el => {
-    popOverTarget.current = el;
-    getTargetRef(el);
-  };
-
-  const popOverContainerRef = el => {
-    popOverContainer.current = el;
-    getContainerRef(el);
-  };
-
-  const togglePopup = e => {
-    let {
-      togglePopup
-    } = props;
-    togglePopup(e, boxPosition);
-  };
-
-  useEffectCallOnlyAfterState(() => {
-    isPopupOpen && onPopupOpen && onPopupOpen();
-    !isPopupOpen && onPopupClose && onPopupClose();
-  }, [isPopupOpen]);
-  let childrens = React.Children.map(children, (child, index) => {
-    let element = index === 1 ? /*#__PURE__*/React.cloneElement(child, {
-      isPopupOpen,
-      togglePopup: togglePopup,
-      removeClose,
-      right,
-      left,
-      top,
-      bottom,
-      arrowRight,
-      arrowLeft,
-      arrowTop,
-      arrowBottom,
-      boxPosition: position,
-      isAnimate,
-      isArrow,
-      arrowPosition,
-      size,
-      onClick,
-      getRef: popOverContainerRef,
-      isPopupReady
-    }) : /*#__PURE__*/React.cloneElement(child, {
-      isPopupOpen,
-      togglePopup: togglePopup,
-      removeClose,
-      getRef: popOverTargetRef
-    });
-    return element;
-  });
-  return /*#__PURE__*/React.createElement("div", {
-    className: style.popup
-  }, childrens);
-}
-
-PopOver.defaultProps = PopOver_defaultProps;
-PopOver.propTypes = PopOver_propTypes;
-export default Popup(PopOver);
-export function PopOverTarget(props) {
-  let {
-    children,
-    togglePopup
-  } = props;
-
-  const getRef = el => {
-    let {
-      getRef
-    } = props;
-    getRef(el);
-  };
-
-  return /*#__PURE__*/React.createElement("div", {
-    className: style.target,
-    onClick: togglePopup,
-    ref: getRef
-  }, children);
-}
-PopOverTarget.propTypes = PopOverTarget_propTypes;
-export function PopOverContainer(props) {
-  let {
-    children,
-    isPopupOpen,
-    isAnimate,
-    isArrow,
-    size,
-    arrowPosition,
-    boxPosition,
-    right,
-    left,
-    top,
-    bottom,
-    arrowRight,
-    arrowLeft,
-    arrowTop,
-    arrowBottom,
-    animationStyle,
-    onClick,
-    removeClose
-  } = props;
-
-  const getRef = el => {
-    let {
-      getRef
-    } = props;
-    getRef && getRef(el);
-  };
-
-  const handleClick = e => {
-    removeClose && removeClose(e);
-    onClick && onClick();
-  };
-
-  return /*#__PURE__*/React.createElement(ResponsiveDropBox, {
-    animationStyle: animationStyle,
-    arrowBottom: arrowBottom,
-    arrowLeft: arrowLeft,
-    arrowPosition: arrowPosition,
-    arrowRight: arrowRight,
-    arrowTop: arrowTop,
-    bottom: bottom,
-    boxPosition: boxPosition,
-    getRef: getRef,
-    isActive: isPopupOpen,
-    isAnimate: isAnimate,
-    isArrow: isArrow,
-    left: left,
-    right: right,
-    size: size,
-    top: top,
-    alignBox: "row"
-  }, /*#__PURE__*/React.createElement(Box, {
-    flexible: true,
-    shrink: true,
-    scroll: "vertical"
-  }, children));
-}
-PopOverContainer.defaultProps = PopOverContainer_defaultProps;
-PopOverContainer.propTypes = PopOverContainer_propTypes;

package/es/v1/PopOver/props/defaultProps.js

@@ -1,7 +0,0 @@
-export const PopOver_defaultProps = {
-  isAnimate: false,
-  isArrow: false
-};
-export const PopOverContainer_defaultProps = {
-  isArrow: false
-};

package/es/v1/PopOver/props/propTypes.js

@@ -1,53 +0,0 @@
-import PropTypes from 'prop-types';
-export const PopOver_propTypes = {
-  arrowBottom: PropTypes.string,
-  arrowLeft: PropTypes.string,
-  arrowPosition: PropTypes.string,
-  arrowRight: PropTypes.string,
-  arrowTop: PropTypes.string,
-  bottom: PropTypes.string,
-  boxPosition: PropTypes.string,
-  children: PropTypes.node,
-  getContainerRef: PropTypes.func,
-  getTargetRef: PropTypes.func,
-  isAnimate: PropTypes.bool,
-  isArrow: PropTypes.bool,
-  isPopupOpen: PropTypes.bool,
-  isPopupReady: PropTypes.bool,
-  left: PropTypes.string,
-  onClick: PropTypes.func,
-  onPopupClose: PropTypes.func,
-  onPopupOpen: PropTypes.func,
-  position: PropTypes.string,
-  removeClose: PropTypes.func,
-  right: PropTypes.string,
-  size: PropTypes.string,
-  togglePopup: PropTypes.func,
-  top: PropTypes.string
-};
-export const PopOverTarget_propTypes = {
-  children: PropTypes.node,
-  getRef: PropTypes.func,
-  togglePopup: PropTypes.func
-};
-export const PopOverContainer_propTypes = {
-  animationStyle: PropTypes.string,
-  arrowBottom: PropTypes.string,
-  arrowLeft: PropTypes.string,
-  arrowPosition: PropTypes.string,
-  arrowRight: PropTypes.string,
-  arrowTop: PropTypes.string,
-  bottom: PropTypes.string,
-  boxPosition: PropTypes.string,
-  children: PropTypes.node,
-  getRef: PropTypes.func,
-  isAnimate: PropTypes.bool,
-  isArrow: PropTypes.bool,
-  isPopupOpen: PropTypes.bool,
-  left: PropTypes.string,
-  onClick: PropTypes.func,
-  removeClose: PropTypes.func,
-  right: PropTypes.string,
-  size: PropTypes.string,
-  top: PropTypes.string
-};