@zohodesk/components 1.0.0-temp-195.1 → 1.0.0-temp-197

package/es/v1/DateTime/DateWidget.js

@@ -1,31 +1,31 @@
 /**** Libraries ****/
 import React from 'react';
-import { DateWidget_propTypes } from "./props/propTypes";
-import { DateWidget_defaultProps } from "./props/defaultProps";
+import { DateWidget_propTypes } from './props/propTypes';
+import { DateWidget_defaultProps } from './props/defaultProps';
 /**** Components ****/
 
-import DateTime from "./DateTime";
-import Popup from "../Popup/Popup";
+import DateTime from './DateTime';
+import Popup from '../Popup/Popup';
 import { Icon } from '@zohodesk/icons';
-import { Container } from "../Layout";
-import TextBoxIcon from "../TextBoxIcon/TextBoxIcon";
+import { Container } from '../Layout';
+import TextBoxIcon from '../TextBoxIcon/TextBoxIcon';
 /**** CSS ****/
 
-import style from "../../DateTime/DateWidget.module.css";
+import style from '../../DateTime/DateWidget.module.css';
 /**** Methods ****/
 
-import validator from "../../DateTime/validator";
-import { formatDate } from "../../utils/datetime/common";
-import { getIsSupportedKey, arrayIsNotEqual } from "../../DateTime/dateFormatUtils";
-import { getDateFormatDetails, getDateFormatSelection, getDateTimeString, getDateDetails, getIsValidDate, getSelectedDate, getDateText } from "../../DateTime/dateFormatUtils/dateFormat";
-import { getChangedDay } from "../../DateTime/dateFormatUtils/dayChange";
-import { getChangedMonth } from "../../DateTime/dateFormatUtils/monthChange";
-import { getChangedYear } from "../../DateTime/dateFormatUtils/yearChange";
-import { getChangedHour, getChangedMinute, getChangedNoon } from "../../DateTime/dateFormatUtils/timeChange";
-import { getIsEmptyValue } from "../../utils/Common";
+import validator from '../../DateTime/validator';
+import { formatDate } from '../../utils/datetime/common';
+import { getIsSupportedKey, arrayIsNotEqual } from '../../DateTime/dateFormatUtils';
+import { getDateFormatDetails, getDateFormatSelection, getDateTimeString, getDateDetails, getIsValidDate, getSelectedDate, getDateText } from '../../DateTime/dateFormatUtils/dateFormat';
+import { getChangedDay } from '../../DateTime/dateFormatUtils/dayChange';
+import { getChangedMonth } from '../../DateTime/dateFormatUtils/monthChange';
+import { getChangedYear } from '../../DateTime/dateFormatUtils/yearChange';
+import { getChangedHour, getChangedMinute, getChangedNoon } from '../../DateTime/dateFormatUtils/timeChange';
+import { getIsEmptyValue } from '../../utils/Common';
 /** * Constants ** */
 
-import { INVALID_DATE, i18nShortMonths, i18nMonths } from "../../DateTime/constants";
+import { INVALID_DATE, i18nShortMonths, i18nMonths } from '../../DateTime/constants';
 /* eslint-disable react/no-unused-prop-types */
 
 /* eslint css-modules/no-unused-class: [0, { markAsUsed: 'inputLine'] }] */
@@ -79,7 +79,9 @@ class DateWidgetComponent extends React.Component {
 
   componentDidMount() {
     const {
-      validation
+      validation,
+      getPopupProps,
+      isPopupReady
     } = this.props;
     const {
       selected
@@ -98,6 +100,12 @@ class DateWidgetComponent extends React.Component {
       selected: newSelected
     });
     this.handleSelectionRangeDetails(this.props);
+
+    if (getPopupProps) {
+      getPopupProps({
+        isPopupReady
+      });
+    }
   }
 
   componentDidUpdate(prevProps, prevState) {
@@ -119,7 +127,8 @@ class DateWidgetComponent extends React.Component {
       isPopupReady,
       dateFormat = '',
       is24Hour,
-      isHideCurrentYear
+      isHideCurrentYear,
+      getPopupProps
     } = this.props;
 
     if (validation && validation.validate) {
@@ -154,6 +163,12 @@ class DateWidgetComponent extends React.Component {
       if (isPopupReady) {
         this.resetLocalDate && this.resetLocalDate();
       }
+
+      if (getPopupProps) {
+        getPopupProps({
+          isPopupReady
+        });
+      }
     }
 
     const haveLocalValue = [day, month, year, hour, minute, noon].some(value => !getIsEmptyValue(value));
@@ -990,8 +1005,13 @@ class DateWidgetComponent extends React.Component {
       boxSize,
       onError,
       startDate,
-      endDate
+      endDate,
+      customProps = {}
     } = this.props;
+    const {
+      DateTimeProps = {},
+      TextBoxProps = {}
+    } = customProps;
     const {
       selected: value = '',
       isError,
@@ -1043,7 +1063,8 @@ class DateWidgetComponent extends React.Component {
       iconOnHover: iconOnHover,
       isFocus: isPopupReady,
       autoComplete: false,
-      a11y: a11y
+      a11y: a11y,
+      customProps: TextBoxProps
     }, /*#__PURE__*/React.createElement(Container, {
       align: "both",
       onClick: isDisabled || isReadOnly ? null : this.handleDateIconClick
@@ -1082,7 +1103,8 @@ class DateWidgetComponent extends React.Component {
       boxSize: boxSize,
       onError: onError,
       startDate: startDate,
-      endDate: endDate
+      endDate: endDate,
+      customProps: DateTimeProps
     }));
   }
 

package/es/v1/DateTime/DaysRow.js

@@ -2,13 +2,13 @@
 
 /** ** Libraries *** */
 import React, { PureComponent } from 'react';
-import { DaysRow_propTypes } from "./props/propTypes";
+import { DaysRow_propTypes } from './props/propTypes';
 /** ** CSS *** */
 
-import style from "../../DateTime/DateTime.module.css";
+import style from '../../DateTime/DateTime.module.css';
 /** ** Components *** */
 
-import { Container, Box } from "../Layout";
+import { Container, Box } from '../Layout';
 export default class DaysRow extends PureComponent {
   render() {
     const {

package/es/v1/DateTime/Time.js

@@ -2,15 +2,15 @@
 
 /** ** Libraries *** */
 import React, { PureComponent } from 'react';
-import { Time_propTypes } from "./props/propTypes";
-import { Time_defaultProps } from "./props/defaultProps";
+import { Time_propTypes } from './props/propTypes';
+import { Time_defaultProps } from './props/defaultProps';
 /**** Components ****/
 
-import { Container, Box } from "../Layout";
-import Select from "../Select/Select";
+import { Container, Box } from '../Layout';
+import Select from '../Select/Select';
 /** ** CSS *** */
 
-import style from "../../DateTime/DateTime.module.css";
+import style from '../../DateTime/DateTime.module.css';
 export default class Time extends PureComponent {
   render() {
     const {
@@ -28,8 +28,14 @@ export default class Time extends PureComponent {
       ampmSuggestions,
       onAmPmSelect,
       amPm,
-      is24Hour
+      is24Hour,
+      customProps = {}
     } = this.props;
+    const {
+      HourSelectProps = {},
+      MinuteSelectProps = {},
+      AmPmSelectProps = {}
+    } = customProps;
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
       className: style.text
     }, timeText), /*#__PURE__*/React.createElement(Container, {
@@ -46,7 +52,8 @@ export default class Time extends PureComponent {
       onHourSelect: onHourSelect,
       hours: hours,
       needResponsive: needResponsive,
-      hourEmptyText: hourEmptyText
+      hourEmptyText: hourEmptyText,
+      customProps: HourSelectProps
     })), /*#__PURE__*/React.createElement(Box, {
       flexible: true,
       className: style.dropDownContainer
@@ -55,7 +62,8 @@ export default class Time extends PureComponent {
       onMinutesSelect: onMinutesSelect,
       mins: mins,
       minuteEmptyText: minuteEmptyText,
-      needResponsive: needResponsive
+      needResponsive: needResponsive,
+      customProps: MinuteSelectProps
     })), !is24Hour ? /*#__PURE__*/React.createElement(Box, {
       flexible: true,
       className: style.dropDownContainer
@@ -63,7 +71,8 @@ export default class Time extends PureComponent {
       ampmSuggestions: ampmSuggestions,
       onAmPmSelect: onAmPmSelect,
       amPm: amPm,
-      needResponsive: needResponsive
+      needResponsive: needResponsive,
+      customProps: AmPmSelectProps
     })) : null));
   }
 
@@ -78,7 +87,8 @@ class Hour extends React.PureComponent {
       onHourSelect,
       hours,
       needResponsive,
-      hourEmptyText
+      hourEmptyText,
+      customProps
     } = this.props;
     return /*#__PURE__*/React.createElement(Select, {
       options: hourSuggestions,
@@ -98,7 +108,8 @@ class Hour extends React.PureComponent {
       needResponsive: needResponsive,
       needListBorder: true,
       needTick: false,
-      listItemSize: "small"
+      listItemSize: "small",
+      ...customProps
     });
   }
 
@@ -111,7 +122,8 @@ class Minute extends React.PureComponent {
       onMinutesSelect,
       mins,
       minuteEmptyText,
-      needResponsive
+      needResponsive,
+      customProps
     } = this.props;
     return /*#__PURE__*/React.createElement(Select, {
       options: minSuggestions,
@@ -131,7 +143,8 @@ class Minute extends React.PureComponent {
       needResponsive: needResponsive,
       needListBorder: true,
       needTick: false,
-      listItemSize: "small"
+      listItemSize: "small",
+      ...customProps
     });
   }
 
@@ -143,7 +156,8 @@ class AmPm extends React.PureComponent {
       ampmSuggestions,
       onAmPmSelect,
       amPm,
-      needResponsive
+      needResponsive,
+      customProps
     } = this.props;
     return /*#__PURE__*/React.createElement(Select, {
       options: ampmSuggestions,
@@ -159,7 +173,8 @@ class AmPm extends React.PureComponent {
       needResponsive: needResponsive,
       needListBorder: true,
       needTick: false,
-      listItemSize: "small"
+      listItemSize: "small",
+      ...customProps
     });
   }
 

package/es/v1/DateTime/YearView.js

@@ -1,19 +1,19 @@
 /**** Libraries ****/
 import React from 'react';
-import { YearView_propTypes } from "./props/propTypes";
-import { YearView_defaultProps } from "./props/defaultProps";
+import { YearView_propTypes } from './props/propTypes';
+import { YearView_defaultProps } from './props/defaultProps';
 /**** Components ****/
 
 import { Virtualizer } from '@zohodesk/virtualizer';
-import { Container, Box } from "../Layout";
+import { Container, Box } from '../Layout';
 import { Icon } from '@zohodesk/icons';
-import Heading from "../Heading/Heading";
+import Heading from '../Heading/Heading';
 /**** CSS ****/
 
-import style from "../../DateTime/YearView.module.css";
+import style from '../../DateTime/YearView.module.css';
 /**** Methods ****/
 
-import { getYearDetails } from "../../DateTime/dateFormatUtils";
+import { getYearDetails } from '../../DateTime/dateFormatUtils';
 const monthNamesData = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
 
 function getYears() {

package/es/v1/DateTime/index.js

@@ -1 +1 @@
-export { default as DateWidget } from "./DateWidget";
+export { default as DateWidget } from './DateWidget';

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { dataFormatList } from "../../../DateTime/dateFormatUtils/dateFormats";
+import { dataFormatList } from '../../../DateTime/dateFormatUtils/dateFormats';
 export const CalendarView_propTypes = {
   dataId: PropTypes.string,
   date: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
@@ -78,7 +78,8 @@ export const DateTime_propTypes = {
   isRestrictScroll: PropTypes.bool,
   dropBoxPortalId: PropTypes.string,
   startDate: PropTypes.string,
-  endDate: PropTypes.string
+  endDate: PropTypes.string,
+  customProps: PropTypes.object
 };
 export const DateWidget_propTypes = {
   borderColor: PropTypes.oneOf(['transparent', 'default']),
@@ -147,7 +148,9 @@ export const DateWidget_propTypes = {
   dropBoxPortalId: PropTypes.string,
   a11y: PropTypes.object,
   startDate: PropTypes.string,
-  endDate: PropTypes.string
+  endDate: PropTypes.string,
+  getPopupProps: PropTypes.func,
+  customProps: PropTypes.object
 };
 export const YearView_propTypes = {
   onSelectMonth: PropTypes.func,
@@ -191,5 +194,6 @@ export const Time_propTypes = {
   ampmSuggestions: PropTypes.array,
   onAmPmSelect: PropTypes.func,
   amPm: PropTypes.string,
-  is24Hour: PropTypes.bool
+  is24Hour: PropTypes.bool,
+  customProps: PropTypes.object
 };

package/es/v1/DropBox/DropBox.js

@@ -1,14 +1,14 @@
 import React, { useRef, useContext } from 'react';
 import FocusScope from '@zohodesk/a11y/es/FocusScope/FocusScope';
-import Modal from "../Modal/Modal";
-import LibraryContext from "../../Provider/LibraryContextInit";
-import cssJSLogic from "../../DropBox/css/cssJSLogic";
-import DropBoxElement from "./DropBoxElement/DropBoxElement";
-import { DropBoxDefaultProps } from "./props/defaultProps";
-import { DropBoxPropTypes } from "./props/propTypes";
-import { stopPropagation } from "../../utils/Common";
-import isMobilePopover from "./utils/isMobilePopover";
-import style from "../../DropBox/css/DropBox.module.css";
+import Modal from '../Modal/Modal';
+import LibraryContext from '../../Provider/LibraryContextInit';
+import cssJSLogic from '../../DropBox/css/cssJSLogic';
+import DropBoxElement from './DropBoxElement/DropBoxElement';
+import { DropBoxDefaultProps } from './props/defaultProps';
+import { DropBoxPropTypes } from './props/propTypes';
+import { stopPropagation } from '../../utils/Common';
+import isMobilePopover from './utils/isMobilePopover';
+import style from '../../DropBox/css/DropBox.module.css';
 export default function DropBox(props) {
   const dropBoxRef = useRef(null);
   const DropBoxContext = useContext(LibraryContext);

package/es/v1/DropBox/DropBoxElement/DropBoxElement.js

@@ -1,11 +1,11 @@
 import React from 'react';
-import useDropboxPosCalc from "../../../DropBox/DropBoxElement/useDropboxPosCalc";
-import cssJSLogic from "../../../DropBox/DropBoxElement/css/cssJSLogic";
-import { positionMapping } from "../../../DropBox/DropBoxPositionMapping.json";
-import { DropBoxElementDefaultProps } from "./props/defaultProps";
-import { DropBoxElementPropTypes } from "./props/propTypes";
+import useDropboxPosCalc from '../../../DropBox/DropBoxElement/useDropboxPosCalc';
+import cssJSLogic from '../../../DropBox/DropBoxElement/css/cssJSLogic';
+import { positionMapping } from '../../../DropBox/DropBoxPositionMapping.json';
+import { DropBoxElementDefaultProps } from './props/defaultProps';
+import { DropBoxElementPropTypes } from './props/propTypes';
 import { mergeStyle } from '@zohodesk/utils';
-import style from "../../../DropBox/DropBoxElement/css/DropBoxElement.module.css";
+import style from '../../../DropBox/DropBoxElement/css/DropBoxElement.module.css';
 export default function DropBoxElement(props) {
   let {
     children,

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

@@ -1,4 +1,4 @@
-import { DropBoxElementDefaultProps } from "../DropBoxElement/props/defaultProps";
+import { DropBoxElementDefaultProps } from '../DropBoxElement/props/defaultProps';
 export const defaultProps = {
   needResponsive: true,
   portalId: 'portal1',

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { DropBoxElementPropTypes } from "../DropBoxElement/props/propTypes";
+import { DropBoxElementPropTypes } from '../DropBoxElement/props/propTypes';
 export const propTypes = {
   needResponsive: PropTypes.bool,
   portalId: PropTypes.string,

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/DropDown/DropDown.js

@@ -1,8 +1,8 @@
 import React from 'react';
-import { DropDown_propTypes, DropDownTarget_propTypes, DropDownContainer_propTypes, DropDownItemContainer_propTypes } from "./props/propTypes";
-import { DropDownItemContainer_defaultProps } from "./props/defaultProps";
-import style from "../../DropDown/DropDown.module.css";
-import PopOver, { PopOverTarget, PopOverContainer } from "../PopOver/PopOver";
+import { DropDown_propTypes, DropDownTarget_propTypes, DropDownContainer_propTypes, DropDownItemContainer_propTypes } from './props/propTypes';
+import { DropDownItemContainer_defaultProps } from './props/defaultProps';
+import style from '../../DropDown/DropDown.module.css';
+import PopOver, { PopOverTarget, PopOverContainer } from '../PopOver/PopOver';
 export default function DropDown(props) {
   let {
     children

package/es/v1/DropDown/DropDownHeading.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import { DropDownHeading_propTypes } from "./props/propTypes";
-import { DropDownHeading_defaultProps } from "./props/defaultProps";
-import style from "../../DropDown/DropDownHeading.module.css";
+import { DropDownHeading_propTypes } from './props/propTypes';
+import { DropDownHeading_defaultProps } from './props/defaultProps';
+import style from '../../DropDown/DropDownHeading.module.css';
 export default function DropDownHeading(props) {
   let {
     text,

package/es/v1/DropDown/DropDownItem.js

@@ -1,7 +1,7 @@
 import React, { useRef } from 'react';
-import { DropDownItem_propTypes } from "./props/propTypes";
-import { DropDownItem_defaultProps } from "./props/defaultProps";
-import style from "../../DropDown/DropDownItem.module.css";
+import { DropDownItem_propTypes } from './props/propTypes';
+import { DropDownItem_defaultProps } from './props/defaultProps';
+import style from '../../DropDown/DropDownItem.module.css';
 export default function DropDownItem(props) {
   let {
     value,

package/es/v1/DropDown/DropDownSearch.js

@@ -1,8 +1,8 @@
 import React, { useEffect, useRef } from 'react';
-import { DropDownSearch_propTypes } from "./props/propTypes";
-import { DropDownSearch_defaultProps } from "./props/defaultProps";
-import TextBox from "../TextBox/TextBox";
-import style from "../../DropDown/DropDownSearch.module.css";
+import { DropDownSearch_propTypes } from './props/propTypes';
+import { DropDownSearch_defaultProps } from './props/defaultProps';
+import TextBox from '../TextBox/TextBox';
+import style from '../../DropDown/DropDownSearch.module.css';
 export default function DropDownSearch(props) {
   let {
     name,

package/es/v1/DropDown/DropDownSeparator.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { DropDownSeparator_propTypes } from "./props/propTypes";
-import style from "../../DropDown/DropDownSeparator.module.css";
+import { DropDownSeparator_propTypes } from './props/propTypes';
+import style from '../../DropDown/DropDownSeparator.module.css';
 export default function DropDownSeparator(props) {
   let {
     customClass = ''

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

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { PopOver_propTypes } from "./../../PopOver/props/propTypes";
+import { PopOver_propTypes } from './../../PopOver/props/propTypes';
 export const DropDown_propTypes = { ...PopOver_propTypes
 };
 export const DropDownTarget_propTypes = {

package/es/v1/Heading/Heading.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import style from "../../Heading/Heading.module.css";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
+import style from '../../Heading/Heading.module.css';
 export default function Heading(props) {
   let {
     tagName,

package/es/v1/Label/Label.js

@@ -1,8 +1,8 @@
 import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import style from "../../Label/Label.module.css";
-import colors from "../../Label/LabelColors.module.css";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
+import style from '../../Label/Label.module.css';
+import colors from '../../Label/LabelColors.module.css';
 export default function Label(props) {
   const {
     text,

package/es/v1/Layout/Box.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { BoxProps as propTypes } from "./props/propTypes";
-import { BoxDefaultProps as defaultProps } from "./props/defaultProps";
+import { BoxProps as propTypes } from './props/propTypes';
+import { BoxDefaultProps as defaultProps } from './props/defaultProps';
 /* eslint css-modules/no-unused-class: 0 */
 
-import { createProps, getClass, setProps } from "../../Layout/utils";
-import style from "../../Layout/Layout.module.css";
+import { createProps, getClass, setProps } from '../../Layout/utils';
+import style from '../../Layout/Layout.module.css';
 /* eslint-disable  react/no-unused-prop-types*/
 
 function getBoxClassNames(props) {

package/es/v1/Layout/Container.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { ContainerProps as propTypes } from "./props/propTypes";
-import { ContainerDefaultProps as defaultProps } from "./props/defaultProps";
+import { ContainerProps as propTypes } from './props/propTypes';
+import { ContainerDefaultProps as defaultProps } from './props/defaultProps';
 /* eslint css-modules/no-unused-class: 0 */
 
-import { createProps, getClass, setProps } from "../../Layout/utils";
-import style from "../../Layout/Layout.module.css";
+import { createProps, getClass, setProps } from '../../Layout/utils';
+import style from '../../Layout/Layout.module.css';
 /* eslint-disable  react/no-unused-prop-types*/
 
 function getContainerClassNames(props) {

package/es/v1/Layout/index.js

@@ -1,2 +1,2 @@
-export { default as Container } from "./Container";
-export { default as Box } from "./Box";
+export { default as Container } from './Container';
+export { default as Box } from './Box';

package/es/v1/ListItem/ListContainer.js

@@ -1,11 +1,11 @@
 /**** Libraries ****/
 import React, { useCallback } from 'react';
-import { Container } from "../Layout";
-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 { Container } from '../Layout';
+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';
 
 const ListContainer = props => {
   const {

package/es/v1/ListItem/ListItem.js

@@ -1,15 +1,15 @@
 /**** Libraries ****/
 import React from 'react';
-import { Box } from "../Layout";
-import ListContainer from "./ListContainer";
-import { ListItemDefaultProps } from "./props/defaultProps";
-import { ListItem_Props } from "./props/propTypes";
+import { Box } from '../Layout';
+import ListContainer from './ListContainer';
+import { ListItemDefaultProps } from './props/defaultProps';
+import { ListItem_Props } from './props/propTypes';
 /**** Components ****/
 
 import { Icon } from '@zohodesk/icons';
 /**** CSS ****/
 
-import style from "../../ListItem/ListItem.module.css";
+import style from '../../ListItem/ListItem.module.css';
 
 const ListItem = props => {
   let {

package/es/v1/ListItem/ListItemWithAvatar.js

@@ -1,17 +1,17 @@
 /**** Libraries ****/
 import React, { memo } from 'react';
-import { Box } from "../Layout";
-import ListContainer from "./ListContainer";
-import { ListItemWithAvatarDefaultProps } from "./props/defaultProps";
-import { ListItemWithAvatar_Props } from "./props/propTypes";
+import { Box } from '../Layout';
+import ListContainer from './ListContainer';
+import { ListItemWithAvatarDefaultProps } from './props/defaultProps';
+import { ListItemWithAvatar_Props } from './props/propTypes';
 /**** Components ****/
 
-import Avatar from "../Avatar/Avatar";
-import AvatarTeam from "../AvatarTeam/AvatarTeam";
+import Avatar from '../Avatar/Avatar';
+import AvatarTeam from '../AvatarTeam/AvatarTeam';
 import { Icon } from '@zohodesk/icons';
 /**** CSS ****/
 
-import style from "../../ListItem/ListItem.module.css";
+import style from '../../ListItem/ListItem.module.css';
 
 const ListItemWithAvatar = props => {
   let {

package/es/v1/ListItem/ListItemWithCheckBox.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import ListContainer from "./ListContainer";
-import { ListItemWithCheckBoxDefaultProps } from "./props/defaultProps";
-import { ListItemWithCheckBox_Props } from "./props/propTypes";
-import CheckBox from "../CheckBox/CheckBox";
-import { Box } from "../Layout";
-import style from "../../ListItem/ListItem.module.css";
+import ListContainer from './ListContainer';
+import { ListItemWithCheckBoxDefaultProps } from './props/defaultProps';
+import { ListItemWithCheckBox_Props } from './props/propTypes';
+import CheckBox from '../CheckBox/CheckBox';
+import { Box } from '../Layout';
+import style from '../../ListItem/ListItem.module.css';
 
 const ListItemWithCheckBox = props => {
   let {