@zohodesk/components 1.0.0-temp-190.2 → 1.0.0-temp-192

package/es/TextBox/TextBox.module.css

@@ -32,36 +32,30 @@
 }
 
 .basic::placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
 .basic::-webkit-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
 .basic::-moz-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
 .basic::-ms-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
+
 /* css:lineheight-validation:ignore */
 .container {
   composes: basic;
-  /* css:theme-validation:ignore */
   transition: border var(--zd_transition2) linear 0s;
   -moz-transition: border var(--zd_transition2) linear 0s;
   width: var(--textbox_width);
-  /* css:theme-validation:ignore */
   color: var(--textbox_text_color);
   font-size: var(--textbox_font_size);
   height: var(--textbox_height);
-  /* css:theme-validation:ignore */
   line-height: var(--textbox_line_height);
   background-color: var(--textbox_bg_color);
   -webkit-transition: border var(--zd_transition2) linear 0s;
@@ -85,22 +79,18 @@
 }
 
 .container::placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
 .container::-webkit-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
 .container::-moz-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
 .container::-ms-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textbox_placeholder_text_color);
 }
 
@@ -114,11 +104,6 @@
   border-style: var(--textbox_border_style);
 }
 
-.effect:hover,
-.effect:focus {
-  /* css:theme-validation:ignore */
-}
-
 .effect:hover, .effect:focus {
   border-color: var(--textbox_border_color);
 }
@@ -127,11 +112,6 @@
   --textbox_border_width: 0 0 1px 0;
 }
 
-.borderColor_transparent,
-.borderColor_default {
-  /* css:theme-validation:ignore */
-}
-
 .borderColor_transparent, .borderColor_default {
   border-color: var(--textbox_border_color);
 }

package/es/TextBoxIcon/TextBoxIcon.module.css

@@ -24,7 +24,6 @@
   cursor: var(--textboxicon_icon_cursor);
 }
 .iconContainer {
-  /* css:theme-validation:ignore */
   color: var(--textboxicon_icon_color);
 }
 .effect:hover .iconContainer,
@@ -51,10 +50,6 @@
   right: 0 ;
   left: 0 ;
 }
-.line,
-.borderColor_default {
-  /* css:theme-validation:ignore */
-}
 .line, .borderColor_default {
   background-color: var(--textboxicon_line_color);
 }

package/es/Textarea/Textarea.module.css

@@ -19,7 +19,6 @@
   appearance: none;
   outline: 0;
   letter-spacing: 0.1px;
-  /* css:theme-validation:ignore */
   color: var(--textarea_text_color);
   cursor: var(--textarea_cursor);
 }
@@ -27,19 +26,15 @@
   border-width: var(--textarea_border_width);
 }
 .basic::placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textarea_placeholder_text_color);
 }
 .basic::-webkit-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textarea_placeholder_text_color);
 }
 .basic::-moz-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textarea_placeholder_text_color);
 }
 .basic::-ms-placeholder {
-  /* css:theme-validation:ignore */
   color: var(--textarea_placeholder_text_color);
 }
 .basic:disabled {
@@ -73,7 +68,6 @@
   min-width: var(--zd_size100) ;
   font-size: var(--textarea_font_size);
   line-height: var(--textarea_line_height);
-  /* css:theme-validation:ignore */
   height: var(--textarea_height);
   -webkit-transition: border var(--zd_transition2) linear 0s,
     height var(--zd_transition2) linear 0s;

package/es/common/customscroll.module.css

@@ -9,6 +9,7 @@
   --zd-scroll-thump-hoverbg: var(--zdt_customscroll_thump_hover_bg);
   --zd-scroll-border: var(--zdt_customscroll_border);
 }
+
 .scroll[data-scroll-palette='dark'],
 .scroll [data-scroll-palette='dark'] {
   --zd-scroll-bg: var(--zdt_customscroll_dark_bg);
@@ -16,92 +17,114 @@
   --zd-scroll-thump-hoverbg: var(--zdt_customscroll_thump_dark_hover_bg);
   --zd-scroll-border: var(--zdt_customscroll_dark_border);
 }
+
 .scroll,
 .scroll * {
+  /* css:theme-validation:ignore */
   scrollbar-color: var(--zd-scroll-thump) var(--zd-scroll-bg);
   scrollbar-width: thin;
+  /* css:theme-validation:ignore */
   -ms-scrollbar-highlight-color: var(--zd-scroll-bg);
+  /* css:theme-validation:ignore */
   -ms-scrollbar-face-color: var(--zd-scroll-thump);
 }
+
 .scroll::-webkit-scrollbar,
 .scroll ::-webkit-scrollbar {
   /* css:theme-validation:ignore */
 }
+
 .scroll::-webkit-scrollbar, .scroll ::-webkit-scrollbar {
   background: var(--zd-scroll-corner-bg);
 }
+
 .scroll::-webkit-scrollbar:hover,
 .scroll ::-webkit-scrollbar:hover {
   /* css:theme-validation:ignore */
 }
+
 .scroll::-webkit-scrollbar:hover, .scroll ::-webkit-scrollbar:hover {
   background: var(--zd-scroll-bg);
 }
+
 .scroll::-webkit-scrollbar:horizontal,
 .scroll ::-webkit-scrollbar:horizontal {
   height: var(--zd-scroll-height);
 }
+
 .scroll::-webkit-scrollbar:vertical,
 .scroll ::-webkit-scrollbar:vertical {
   width: var(--zd-scroll-width);
 }
+
 .scroll::-webkit-scrollbar-button,
 .scroll ::-webkit-scrollbar-button {
   display: none;
   width: 0 ;
   height: 0 ;
 }
+
 [dir=ltr] .scroll::-webkit-scrollbar-track:vertical, [dir=ltr] .scroll ::-webkit-scrollbar-track:vertical {
   border-left: 1px solid transparent;
   border-right: 1px solid transparent;
 }
+
 [dir=rtl] .scroll::-webkit-scrollbar-track:vertical, [dir=rtl] .scroll ::-webkit-scrollbar-track:vertical {
   border-right: 1px solid transparent;
   border-left: 1px solid transparent;
 }
+
 .scroll::-webkit-scrollbar-track:vertical:hover,
 .scroll ::-webkit-scrollbar-track:vertical:hover {
   /* css:theme-validation:ignore */
 }
+
 .scroll::-webkit-scrollbar-track:vertical:hover, .scroll ::-webkit-scrollbar-track:vertical:hover {
   border-color: var(--zd-scroll-border);
 }
+
 .scroll::-webkit-scrollbar-track:horizontal, .scroll ::-webkit-scrollbar-track:horizontal {
   border-top: 1px solid transparent;
   border-bottom: 1px solid transparent;
 }
+
 .scroll::-webkit-scrollbar-track:horizontal:hover,
 .scroll ::-webkit-scrollbar-track:horizontal:hover {
   /* css:theme-validation:ignore */
 }
+
 .scroll::-webkit-scrollbar-track:horizontal:hover, .scroll ::-webkit-scrollbar-track:horizontal:hover {
   border-color: var(--zd-scroll-border);
 }
+
 .scroll::-webkit-scrollbar-track-piece, .scroll ::-webkit-scrollbar-track-piece {
   background: inherit;
 }
+
 .scroll::-webkit-scrollbar-thumb,
 .scroll ::-webkit-scrollbar-thumb {
-  /* css:theme-validation:ignore */
   /* css:theme-validation:ignore */
   /* display: none; */
 }
+
 .scroll::-webkit-scrollbar-thumb, .scroll ::-webkit-scrollbar-thumb {
   border-radius: 10px;
   background: var(--zd-scroll-thump);
   background-clip: padding-box;
   border: 3px solid transparent;
 }
+
 .scroll::-webkit-scrollbar-thumb:hover,
 .scroll ::-webkit-scrollbar-thumb:hover {
   /* css:theme-validation:ignore */
-  /* css:theme-validation:ignore */
 }
+
 .scroll::-webkit-scrollbar-thumb:hover, .scroll ::-webkit-scrollbar-thumb:hover {
   background: var(--zd-scroll-thump-hoverbg);
   background-clip: padding-box;
   border: 3px solid transparent;
 }
+
 /* .scroll:hover > ::-webkit-scrollbar-thumb,
 .scroll *:hover > ::-webkit-scrollbar-thumb {
   display: block;
@@ -113,6 +136,7 @@
 .scroll::-webkit-scrollbar-corner, .scroll ::-webkit-scrollbar-corner {
   background: var(--zd-scroll-corner-bg);
 }
+
 .scroll::-webkit-resizer, .scroll ::-webkit-resizer {
   background: inherit;
-}
+}

package/es/v1/Animation/Animation.js

@@ -17,7 +17,7 @@ export default function Animation(props) {
   } = props;
   let newClassNames = delayClassName ? Object.assign({}, animationStyle[name], {
     exit: `${delayClassName} ${animationStyle[name].exit}`
-  }) : animaanimationStyletion[name];
+  }) : animationStyle[name];
   return /*#__PURE__*/React.createElement(CSSTransition, {
     classNames: newClassNames && newClassNames,
     in: isActive,

package/es/v1/Card/Card.js

@@ -3,7 +3,7 @@ import { useEffectCallOnlyAfterState } from '@zohodesk/hooks';
 import { CardHeader_propTypes, CardContent_propTypes, Card_propTypes, CardFooter_propTypes } from './props/propTypes';
 import { Card_defaultProps, CardHeader_defaultProps, CardContent_defaultProps, CardFooter_defaultProps } from './props/defaultProps';
 import { Container, Box } from '../Layout';
-import { getLibraryConfig } from '../Provider/Config';
+import { getLibraryConfig } from '../../Provider/Config';
 import style from '../../Card/Card.module.css';
 /* eslint-disable react/forbid-component-props */
 

package/es/v1/CheckBox/CheckBox.js

@@ -5,7 +5,7 @@ import { propTypes } from './props/propTypes';
 import { defaultProps } from './props/defaultProps';
 import Label from '../Label/Label';
 import { Container, Box } from '../Layout';
-import CssProvider from '../Provider/CssProvider';
+import CssProvider from '../../Provider/CssProvider';
 import style from '../../CheckBox/CheckBox.module.css';
 
 const CheckBox = props => {
@@ -24,6 +24,7 @@ const CheckBox = props => {
     isFilled,
     isClipped,
     getRef,
+    getContainerRef,
     variant,
     active,
     dataId,
@@ -42,6 +43,10 @@ const CheckBox = props => {
     onChange && onChange(!checked, e);
   }
 
+  function handleGetContainerRef(ele) {
+    getContainerRef && getContainerRef(ele, id);
+  }
+
   let {
     CheckBoxProps = {},
     LabelProps = {}
@@ -73,6 +78,7 @@ const CheckBox = props => {
     onClick: isReadOnly || disabled ? null : onChange,
     tabIndex: isReadOnly || disabled || ariaHidden ? '-1' : '0',
     "aria-checked": ariaChecked,
+    eleRef: handleGetContainerRef,
     role: role,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledby,

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

@@ -8,6 +8,7 @@ export const propTypes = {
   disabled: PropTypes.bool,
   disabledTitle: PropTypes.string,
   getRef: PropTypes.func,
+  getContainerRef: PropTypes.func,
   id: PropTypes.string,
   isFilled: PropTypes.bool,
   isClipped: PropTypes.bool,

package/es/v1/DropBox/utils/isMobilePopover.js

@@ -1,4 +1,4 @@
-import { getLibraryConfig } from '../../Provider/Config';
+import { getLibraryConfig } from '../../../Provider/Config';
 export default function isMobilePopover(needResponsive) {
   //   let { needResponsive } = props;
   let windowWidth,

package/es/v1/ListItem/ListContainer.js

@@ -7,7 +7,7 @@ import CssProvider from '../../Provider/CssProvider';
 import style from '../../ListItem/ListItem.module.css';
 import { ListContainerDefaultProps } from './props/defaultProps';
 import { ListContainer_Props } from './props/propTypes';
-import { useResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { useResponsiveReceiver } from '../../Responsive/CustomResponsive';
 
 const ListContainer = props => {
   const {

package/es/v1/MultiSelect/AdvancedGroupMultiSelect.js

@@ -15,7 +15,7 @@ import EmptyState from './EmptyState';
 import Card, { CardContent, CardHeader, CardFooter } from '../Card/Card';
 import { getUniqueId } from '../../Provider/IdProvider';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 /**** Icons ****/
 
 import { Icon } from '@zohodesk/icons';

package/es/v1/MultiSelect/AdvancedMultiSelect.js

@@ -18,7 +18,7 @@ import Card, { CardContent, CardHeader, CardFooter } from '../Card/Card';
 import { Icon } from '@zohodesk/icons';
 import { getUniqueId } from '../../Provider/IdProvider';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 /**** CSS ****/
 

package/es/v1/MultiSelect/MultiSelectWithAvatar.js

@@ -17,7 +17,7 @@ import MobileHeader from './MobileHeader/MobileHeader';
 import MultiSelectHeader from './MultiSelectHeader';
 import CssProvider from '../../Provider/CssProvider';
 import { getUniqueId } from '../../Provider/IdProvider';
-import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox'; // import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox'; // import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 import isMobilePopover from '../DropBox/utils/isMobilePopover';

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

@@ -1,4 +1,4 @@
-import { getLibraryConfig } from '../../Provider/Config';
+import { getLibraryConfig } from '../../../Provider/Config';
 export const AdvancedGroupMultiSelect_defaultProps = {
   animationStyle: 'bounce',
   autoComplete: getLibraryConfig('autoComplete'),
@@ -109,7 +109,8 @@ export const MultiSelect_defaultProps = {
   dataSelectorId: 'multiSelect',
   keepSelectedOptions: false,
   selectedOptionsCount: 0,
-  cardHeaderName: ''
+  cardHeaderName: '',
+  needResponsive: true
 };
 export const MultiSelectHeader_defaultProps = {
   dataId: 'MultiSelectHeader'
@@ -143,7 +144,8 @@ export const MultiSelectWithAvatar_defaultProps = {
   isLoading: false,
   dataSelectorId: 'multiSelectWithAvatar',
   keepSelectedOptions: false,
-  customProps: {}
+  customProps: {},
+  needResponsive: true
 };
 export const SelectedOptions_defaultProps = {
   size: 'medium'

package/es/v1/Radio/Radio.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
@@ -24,6 +26,9 @@ const Radio = props => {
     active,
     isFilled,
     customClass,
+    customProps,
+    getRef,
+    children,
     a11y
   } = props;
   let {
@@ -36,11 +41,16 @@ const Radio = props => {
   let {
     ariaHidden,
     role = 'radio',
+    tabIndex,
     ariaChecked = checked,
     ariaLabel,
     ariaLabelledby,
     ariaReadonly = isReadOnly || disabled ? true : false
   } = a11y;
+  let {
+    ContainerProps = {},
+    LabelProps = {}
+  } = customProps;
 
   function onChange(e) {
     const {
@@ -49,7 +59,11 @@ const Radio = props => {
     onChange && onChange(value, e);
   }
 
-  return /*#__PURE__*/React.createElement(Container, {
+  function handleGetRef(ele) {
+    getRef && getRef(ele, value);
+  }
+
+  return /*#__PURE__*/React.createElement(Container, _extends({
     dataId: value ? value.toLowerCase() : 'RadioComp',
     isCover: false,
     isInline: text ? false : true,
@@ -59,13 +73,14 @@ const Radio = props => {
     "data-title": toolTip,
     onClick: !isReadOnly && !disabled ? onChange : '',
     "aria-checked": ariaChecked,
-    tabindex: isReadOnly || disabled || ariaHidden ? '-1' : '0',
+    tabindex: isReadOnly || disabled || ariaHidden ? '-1' : tabIndex || '0',
+    eleRef: handleGetRef,
     role: role,
     "aria-Hidden": ariaHidden,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledby,
     "aria-readonly": ariaReadonly
-  }, /*#__PURE__*/React.createElement(Box, {
+  }, ContainerProps), /*#__PURE__*/React.createElement(Box, {
     className: `${style.radio} ${checked ? `${style[`rdBox${palette}`]}` : ''}
           ${isReadOnly || disabled ? '' : `${style[`hover${palette}`]}`} ${style[size]} ${isFilled ? style.filled : ''} ${style[`centerPath${palette}`]} ${customRadio}`
   }, /*#__PURE__*/React.createElement("input", {
@@ -91,18 +106,18 @@ const Radio = props => {
   }) : null))), text && /*#__PURE__*/React.createElement(Box, {
     flexible: true,
     className: style.text
-  }, /*#__PURE__*/React.createElement(Label, {
+  }, /*#__PURE__*/React.createElement(Label, _extends({
     text: text,
-    palette: disabled ? 'disable' : labelPalette,
+    palette: labelPalette,
     size: labelSize,
     type: "title",
     clipped: true,
     dataId: `${text}_label`,
     variant: variant,
     title: toolTip ? toolTip : text,
-    customClass: `${checked && active && !disabled ? `${style[`${palette}checkedActive`]}` : ''}
+    customClass: `${checked && active ? `${style[`${palette}checkedActive`]}` : ''}
             ${style[`${palette}Label`]} ${accessMode} ${customLabel}`
-  })));
+  }, LabelProps))), children);
 };
 
 export default Radio;

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

@@ -10,5 +10,6 @@ export const defaultProps = {
   variant: 'default',
   isFilled: true,
   customClass: {},
+  customProps: {},
   a11y: {}
 };

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

@@ -4,6 +4,7 @@ export const propTypes = {
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
   disabledTitle: PropTypes.string,
+  getRef: PropTypes.func,
   id: PropTypes.string,
   isFilled: PropTypes.bool,
   isReadOnly: PropTypes.bool,
@@ -20,14 +21,20 @@ export const propTypes = {
     customRadio: PropTypes.string,
     customLabel: PropTypes.string
   }),
+  customProps: PropTypes.exact({
+    ContainerProps: PropTypes.object,
+    LabelProps: PropTypes.object
+  }),
   a11y: PropTypes.shape({
     ariaChecked: PropTypes.bool,
     ariaHidden: PropTypes.bool,
     role: PropTypes.string,
+    tabIndex: PropTypes.oneOfType(PropTypes.string, PropTypes.number),
     ariaLabelledby: PropTypes.string,
     ariaLabel: PropTypes.string,
     ariaReadonly: PropTypes.bool
   }),
+  children: PropTypes.node,
   onChange: PropTypes.func,
   text: PropTypes.string
 };

package/es/v1/ResponsiveDropBox/ResponsiveDropBox.js

@@ -5,7 +5,7 @@ import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import DropBox from '../DropBox/DropBox';
 import { Container } from '../Layout';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import style from '../../ResponsiveDropBox/ResponsiveDropBox.module.css';
 export default function ResponsiveDropBox(props) {
   const {

package/es/v1/Select/GroupSelect.js

@@ -16,7 +16,7 @@ import DropDownHeading from '../DropDown/DropDownHeading';
 import { Container, Box } from '../Layout';
 import { getUniqueId } from '../../Provider/IdProvider';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import style from '../../Select/Select.module.css';
 /**** Methods ****/
 

package/es/v1/Select/Select.js

@@ -16,7 +16,7 @@ import EmptyState from '../MultiSelect/EmptyState';
 import { getUniqueId } from '../../Provider/IdProvider';
 import { Icon } from '@zohodesk/icons';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 /**** Methods ****/
 

package/es/v1/Select/SelectWithAvatar.js

@@ -10,13 +10,13 @@ import Tag from '../Tag/Tag';
 import Textbox from '../TextBox/TextBox';
 import TextBoxIcon from '../TextBoxIcon/TextBoxIcon';
 import { Container, Box } from '../Layout';
-import Card, { CardContent, CardHeader, CardFooter } from '../Card/Card';
+import Card, { CardContent, CardHeader } from '../Card/Card';
 import Suggestions from '../MultiSelect/Suggestions';
 import EmptyState from '../MultiSelect/EmptyState';
 import DropDownHeading from '../DropDown/DropDownHeading';
 import { getUniqueId } from '../../Provider/IdProvider';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 /**** CSS ****/
 
@@ -158,9 +158,7 @@ class SelectWithAvatarComponent extends SelectComponent {
       htmlId,
       needEffect,
       isLoading,
-      dataSelectorId,
-      getHeader,
-      getFooter
+      dataSelectorId
     } = this.props;
     i18nKeys = Object.assign({}, i18nKeys, {
       emptyText: i18nKeys.emptyText || emptyMessage,
@@ -296,7 +294,7 @@ class SelectWithAvatarComponent extends SelectComponent {
         a11y: {
           role: 'heading'
         }
-      })) : null, getHeader ? getHeader() : null, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, {
+      })) : null, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, {
         activeId: selectedId,
         suggestions: suggestions,
         getRef: this.suggestionItemRef,
@@ -323,7 +321,7 @@ class SelectWithAvatarComponent extends SelectComponent {
       }), 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(Loader, null))))));
     }) : null);
   }
 

package/es/v1/Select/SelectWithIcon.js

@@ -12,7 +12,7 @@ import EmptyState from '../MultiSelect/EmptyState';
 import { Container, Box } from '../Layout';
 import { getUniqueId } from '../../Provider/IdProvider';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import Loader from '@zohodesk/svg/lib/Loader/Loader';
 /**** Methods ****/
 

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

@@ -1,4 +1,4 @@
-import { getLibraryConfig } from '../../Provider/Config';
+import { getLibraryConfig } from '../../../Provider/Config';
 export const Select_defaultProps = {
   animationStyle: 'bounce',
   autoComplete: getLibraryConfig('autoComplete'),

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

@@ -230,9 +230,7 @@ export const SelectWithAvatar_propTypes = { ...Select_propTypes,
   htmlId: PropTypes.string,
   needEffect: PropTypes.bool,
   isLoading: PropTypes.bool,
-  dataSelectorId: PropTypes.string,
-  getFooter: PropTypes.func,
-  getHeader: PropTypes.func
+  dataSelectorId: PropTypes.string
 };
 export const SelectWithIcon_propTypes = {
   animationStyle: PropTypes.oneOf(['default', 'bounce']),

package/es/v1/Tab/Tabs.js

@@ -7,13 +7,13 @@ import { Tabs_defaultProps } from './props/defaultProps';
 import { Tabs_propTypes } from './props/propTypes';
 import { remConvert, getTotalDimension, cs, throttle, cancelBubblingEffect } from '../../utils/Common';
 import { Box, Container } from '../Layout';
-import ResizeObserver from '../Responsive/ResizeObserver';
+import ResizeObserver from '../../Responsive/ResizeObserver';
 import ListItem from '../ListItem/ListItem';
 import { Icon } from '@zohodesk/icons';
 import tabsStyle from './v1Tabs.module.css';
 import Popup from '../Popup/Popup';
 import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
-import { ResponsiveReceiver } from '../Responsive/CustomResponsive';
+import { ResponsiveReceiver } from '../../Responsive/CustomResponsive';
 import btnstyle from '../../semantic/Button/semanticButton.module.css';
 
 const Tabs = props => {

package/es/v1/Tooltip/Tooltip.js

@@ -3,7 +3,7 @@ import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import { getLibraryConfig } from '../../Provider/Config';
 import style from '../../Tooltip/Tooltip.module.css';
-import ResizeObserver from '../Responsive/ResizeObserver';
+import ResizeObserver from '../../Responsive/ResizeObserver';
 import selectn from 'selectn';
 export default class Tooltip extends React.Component {
   constructor(props) {