@zohodesk/components 1.0.0-temp-219.2 → 1.0.0-temp-226

package/es/Button/css/Button.module.css

@@ -39,7 +39,6 @@
 }
 
 .native:disabled {
-  pointer-events: none;
   --button_cursor: not-allowed;
   --button_opacity: 0.4;
 }
@@ -144,7 +143,7 @@
   --button_text_color: var(--zdt_button_default_text);
 }
 
-.plainprimary:hover {
+.plainprimary:not(:disabled):hover {
   --button_text_color: var(--zdt_button_plainprimary_hover_text);
 }
 
@@ -152,7 +151,7 @@
   --button_text_color: var(--zdt_button_danger_text);
 }
 
-.plaindanger:hover {
+.plaindanger:not(:disabled):hover {
   --button_text_color: var(--zdt_button_danger_hover_text);
 }
 
@@ -160,7 +159,7 @@
   --button_text_color: var(--zdt_button_success_text);
 }
 
-.plainsuccess:hover {
+.plainsuccess:not(:disabled):hover {
   --button_text_color: var(--zdt_button_success_hover_text);
 }
 
@@ -168,7 +167,7 @@
   --button_text_color: var(--zdt_button_secondary_text);
 }
 
-.plainsecondary:hover {
+.plainsecondary:not(:disabled):hover {
   --button_text_color: var(--zdt_button_secondary_hover_text);
 }
 
@@ -184,7 +183,7 @@
   --button_border_width: 1px;
 }
 
-.primary:hover {
+.primary:not(:disabled):hover {
   --button_border_color: var(--zdt_button_primary_hover_border);
   --button_text_color: var(--zdt_button_primary_hover_text);
 }
@@ -195,7 +194,7 @@
   --button_text_color: var(--zdt_button_primaryfill_text);
 }
 
-.primaryfilled:hover {
+.primaryfilled:not(:disabled):hover {
   --button_bg_color: var(--zdt_button_primaryfill_hover_bg);
 }
 
@@ -205,7 +204,7 @@
   --button_text_color: var(--zdt_button_danger_text);
 }
 
-.danger:hover {
+.danger:not(:disabled):hover {
   --button_border_color: var(--zdt_button_danger_hover_border);
   --button_text_color: var(--zdt_button_danger_hover_text);
 }
@@ -216,7 +215,7 @@
   --button_text_color: var(--zdt_button_success_text);
 }
 
-.success:hover {
+.success:not(:disabled):hover {
   --button_border_color: var(--zdt_button_success_hover_border);
   --button_text_color: var(--zdt_button_success_hover_text);
 }
@@ -227,7 +226,7 @@
   --button_text_color: var(--zdt_button_dangerfill_text);
 }
 
-.dangerfilled:hover {
+.dangerfilled:not(:disabled):hover {
   --button_bg_color: var(--zdt_button_dangerfill_hover_bg);
 }
 
@@ -237,7 +236,7 @@
   --button_text_color: var(--zdt_button_secondary_text);
 }
 
-.secondary:hover {
+.secondary:not(:disabled):hover {
   --button_border_color: var(--zdt_button_secondary_hover_border);
   --button_text_color: var(--zdt_button_secondary_hover_text);
 }
@@ -248,7 +247,7 @@
   --button_text_color: var(--zdt_button_secondary_text);
 }
 
-.secondaryfilled:hover {
+.secondaryfilled:not(:disabled):hover {
   --button_text_color: var(--zdt_button_secondary_hover_text);
 }
 
@@ -258,7 +257,7 @@
   --button_text_color: var(--zdt_button_dangerfill_text);
 }
 
-.successfilled:hover {
+.successfilled:not(:disabled):hover {
   --button_border_color: var(--zdt_button_successfill_hover_border);
   --button_bg_color: var(--zdt_button_successfill_hover_bg);
 }
@@ -269,7 +268,7 @@
   --button_text_color: var(--zdt_button_dangerfill_text);
 }
 
-.tertiaryfilled:hover {
+.tertiaryfilled:not(:disabled):hover {
   --button_bg_color: var(--zdt_button_tertiaryfill_hover_bg);
 }
 
@@ -572,4 +571,41 @@
 
 .loader {
   color: var(--dot_mirror)
+}
+
+[dir=ltr] .strike {
+  background-image: repeating-linear-gradient(120deg, var(--button_strike_color), var(--button_strike_color) 1px, var(--button_bg_color) 0px, var(--button_bg_color) 8px);
+}
+
+[dir=rtl] .strike {
+  background-image: repeating-linear-gradient(-120deg, var(--button_strike_color), var(--button_strike_color) 1px, var(--button_bg_color) 0px, var(--button_bg_color) 8px);
+}
+.primaryStrike {
+  --button_strike_color: var(--zdt_button_primary_strike);
+}
+.primaryfilledStrike {
+  --button_strike_color: var(--zdt_button_primaryFilled_strike);
+  --button_border_color: var(--zdt_button_primaryfill_bg);
+}
+.dangerStrike {
+  --button_strike_color: var(--zdt_button_danger_strike);
+}
+.dangerfilledStrike {
+  --button_strike_color: var(--zdt_button_dangerFilled_strike);
+  --button_border_color: var(--zdt_button_dangerfill_bg);
+}
+.secondaryStrike {
+  --button_strike_color: var(--zdt_button_secondary_border);
+}
+.secondaryfilledStrike {
+  --button_strike_color: var(--zdt_button_secondaryFilled_strike);
+  --button_border_color: var(--zdt_button_secondaryfill_bg);
+}
+.tertiaryfilledStrike {
+  --button_strike_color: var(--zdt_button_tertiaryFilled_strike);
+  --button_border_color: var(--zdt_button_tertiaryfill_bg);
+}
+.successfilledStrike {
+  --button_strike_color: var(--zdt_button_successFilled_strike);
+  --button_border_color: var(--zdt_button_successfill_bg);
 }

package/es/Button/css/cssJSLogic.js

@@ -1,4 +1,6 @@
+import { useContext } from 'react';
 import { compileClassNames } from '@zohodesk/utils';
+import LibraryContext from '../../Provider/LibraryContextInit';
 export default function cssJSLogic(_ref) {
   let {
     props,
@@ -12,15 +14,21 @@ export default function cssJSLogic(_ref) {
     size,
     children,
     palette,
-    status
+    status,
+    disabled
   } = props;
   let {
     customButton = '',
     customStatus = '',
     customStatusSize = ''
   } = customClass;
+  const {
+    shouldStrikeThroughDisabledButton
+  } = useContext(LibraryContext);
+  const strikeExcludedPalettes = ['plainprimary', 'plainsecondary'];
   let paletteLower = palette.toLowerCase();
   let statusLower = status.toLowerCase();
+  let canStrikeThrough = !strikeExcludedPalettes.includes(paletteLower);
   let buttonClass = compileClassNames({
     [customButton]: !!customButton,
     [style.bold]: isBold,
@@ -30,6 +38,7 @@ export default function cssJSLogic(_ref) {
     [style[size.toLowerCase()]]: needAppearance && !children,
     [style[`${size}Btn`]]: needAppearance && children,
     [style[`${size}Btn${paletteLower}`]]: needAppearance && children && rounded,
+    [`${style[`${paletteLower}Strike`]} ${style.strike}`]: disabled && canStrikeThrough && shouldStrikeThroughDisabledButton,
     [style.loader]: !!needAppearance && statusLower !== 'none'
   });
   let loaderParentClass = compileClassNames({

package/es/Button/index.js

@@ -1,2 +1,2 @@
-export { default as Button } from "./Button";
-export { default as ButtonPropTypes } from "./props/propTypes";
+export { default as Button } from './Button';
+export { default as ButtonPropTypes } from './props/propTypes';

package/es/Button/props/defaultProps.js

@@ -1,4 +1,4 @@
-import { dummyFunction } from "../../utils/dummyFunction";
+import { dummyFunction } from '../../utils/dummyFunction';
 export const defaultProps = {
   children: null,
   dataId: 'buttonComp',

package/es/Buttongroup/Buttongroup.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import style from "./Buttongroup.module.css";
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
+import style from './Buttongroup.module.css';
 /* eslint css-modules/no-unused-class: [2, { markAsUsed: ['footer','header',
 'tab','alignleft','alignright','aligncenter' ] }] */
 

package/es/Buttongroup/__tests__/Buttongroup.spec.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import Buttongroup from "../Buttongroup.js";
+import Buttongroup from '../Buttongroup.js';
 import { render } from "@testing-library/react";
 describe('Buttongrop - ', () => {
   test('rendering the default props', () => {

package/es/Card/Card.js

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
-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 style from "./Card.module.css";
+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 style from './Card.module.css';
 /* eslint-disable react/forbid-component-props */
 
 /*

package/es/Card/__tests__/Card.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import Card from "../Card";
+import Card from '../Card';
 describe('Card', () => {
   test('rendering the defult props', () => {
     const {

package/es/Card/index.js

@@ -1,4 +1,4 @@
-export { default as Card } from "./Card";
-export { CardHeader } from "./Card";
-export { CardContent } from "./Card";
-export { CardFooter } from "./Card";
+export { default as Card } from './Card';
+export { CardHeader } from './Card';
+export { CardContent } from './Card';
+export { CardFooter } from './Card';

package/es/CheckBox/CheckBox.js

@@ -1,13 +1,11 @@
 import React from 'react';
-import { propTypes } from "./props/propTypes";
-import { defaultProps } from "./props/defaultProps";
-import { ComponentRegisterer } from '@zohodesk/dotkit/es/react/ComponentRegistry';
-import Label from "../Label/Label";
-import { Container, Box } from "../Layout";
-import CssProvider from "../Provider/CssProvider";
-import style from "./CheckBox.module.css";
-
-class CheckBox extends React.Component {
+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 style from './CheckBox.module.css';
+export default class CheckBox extends React.Component {
   constructor(props) {
     super(props);
     this.onChange = this.onChange.bind(this);
@@ -165,15 +163,10 @@ class CheckBox extends React.Component {
   }
 
 }
-
 CheckBox.defaultProps = defaultProps;
 CheckBox.propTypes = propTypes; // if (__DOCS__) {
 //   CheckBox.docs = {
 //     componentGroup: 'Form Elements',
 //     folderName: 'Style Guide'
 //   };
-// }
-
-export default ComponentRegisterer(CheckBox, {
-  name: 'ZDC_CheckBox'
-});
+// }

package/es/CheckBox/__tests__/CheckBox.spec.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import CheckBox from "../CheckBox";
+import CheckBox from '../CheckBox';
 import { render } from "@testing-library/react";
 describe('CheckBox component', () => {
   test('Should be render with the basic set of default props', () => {

package/es/DateTime/CalendarView.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { Span_propTypes, CalendarView_propTypes } from "./props/propTypes";
-import { CalendarView_defaultProps, Span_defaultProps } from "./props/defaultProps";
-import { Container, Box } from "../Layout";
-import style from "./DateTime.module.css";
-import { getMonthEnd } from "../utils/datetime/common";
-import DaysRow from "./DaysRow";
+import { Span_propTypes, CalendarView_propTypes } from './props/propTypes';
+import { CalendarView_defaultProps, Span_defaultProps } from './props/defaultProps';
+import { Container, Box } from '../Layout';
+import style from './DateTime.module.css';
+import { getMonthEnd } from '../utils/datetime/common';
+import DaysRow from './DaysRow';
 /* eslint css-modules/no-unused-class: [0, { markAsUsed: ['container', 'header', 'thArrowConatainer', 'thArrow', 'thMonYear', 'days', 'daysStr', 'timesection', 'timeStr', 'dropDownContainer', 'dropDown', 'footer', 'space'] }] */
 
 export default class CalendarView extends React.PureComponent {

package/es/DateTime/DateTime.js

@@ -2,22 +2,22 @@
 
 /* eslint-disable react/forbid-component-props */
 import React from 'react';
-import { DateTime_propTypes } from "./props/propTypes";
-import { DateTime_defaultProps } from "./props/defaultProps";
+import { DateTime_propTypes } from './props/propTypes';
+import { DateTime_defaultProps } from './props/defaultProps';
 import datetime from '@zohodesk/datetimejs';
-import CalendarView from "./CalendarView";
-import YearView from "./YearView";
-import DateTimePopupHeader from "./DateTimePopupHeader";
-import DateTimePopupFooter from "./DateTimePopupFooter";
-import Time from "./Time";
-import style from "./DateTime.module.css";
-import { formatDate, getMonthEnd } from "../utils/datetime/common";
-import { getIsEmptyValue } from "../utils/Common";
-import { monthNamesDefault, monthNamesShortDefault, dayNamesDefault, dayNamesShortDefault, ampmTextDefault } from "./constants";
-import ResponsiveDropBox from "../ResponsiveDropBox/ResponsiveDropBox";
-import { Box } from "../Layout";
-import { getHourSuggestions, getMinuteSuggestions, addZeroIfNeeded } from "./dateFormatUtils";
-import { getDateText } from "./dateFormatUtils/dateFormat";
+import CalendarView from './CalendarView';
+import YearView from './YearView';
+import DateTimePopupHeader from './DateTimePopupHeader';
+import DateTimePopupFooter from './DateTimePopupFooter';
+import Time from './Time';
+import style from './DateTime.module.css';
+import { formatDate, getMonthEnd } from '../utils/datetime/common';
+import { getIsEmptyValue } from '../utils/Common';
+import { monthNamesDefault, monthNamesShortDefault, dayNamesDefault, dayNamesShortDefault, ampmTextDefault } from './constants';
+import ResponsiveDropBox from '../ResponsiveDropBox/ResponsiveDropBox';
+import { Box } from '../Layout';
+import { getHourSuggestions, getMinuteSuggestions, addZeroIfNeeded } from './dateFormatUtils';
+import { getDateText } from './dateFormatUtils/dateFormat';
 
 function title(date, year, month) {
   let monthNames = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];

package/es/DateTime/DateTimePopupFooter.js

@@ -2,15 +2,15 @@
 
 /** ** Libraries *** */
 import React, { PureComponent } from 'react';
-import { DateTimePopupFooter_propTypes } from "./props/propTypes";
-import { DateTimePopupFooter_defaultProps } from "./props/defaultProps";
+import { DateTimePopupFooter_propTypes } from './props/propTypes';
+import { DateTimePopupFooter_defaultProps } from './props/defaultProps';
 /** ** Components *** */
 
-import { Container } from "../Layout";
-import Button from "../Button/Button";
+import { Container } from '../Layout';
+import Button from '../Button/Button';
 /** ** CSS *** */
 
-import style from "./DateTime.module.css";
+import style from './DateTime.module.css';
 export default class DateTimePopupFooter extends PureComponent {
   render() {
     const {

package/es/DateTime/DateTimePopupHeader.js

@@ -2,15 +2,15 @@
 
 /** ** Libraries *** */
 import React, { PureComponent } from 'react';
-import { DateTimePopupHeader_propTypes } from "./props/propTypes";
+import { DateTimePopupHeader_propTypes } from './props/propTypes';
 /** ** Components *** */
 
-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.module.css";
+import style from './DateTime.module.css';
 
 class Span extends React.PureComponent {
   constructor(props) {

package/es/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 "./DateWidget.module.css";
+import style from './DateWidget.module.css';
 /**** Methods ****/
 
-import validator from "./validator";
-import { formatDate } from "../utils/datetime/common";
-import { getIsSupportedKey, arrayIsNotEqual } from "./dateFormatUtils";
-import { getDateFormatDetails, getDateFormatSelection, getDateTimeString, getDateDetails, getIsValidDate, getSelectedDate, getDateText } from "./dateFormatUtils/dateFormat";
-import { getChangedDay } from "./dateFormatUtils/dayChange";
-import { getChangedMonth } from "./dateFormatUtils/monthChange";
-import { getChangedYear } from "./dateFormatUtils/yearChange";
-import { getChangedHour, getChangedMinute, getChangedNoon } from "./dateFormatUtils/timeChange";
-import { getIsEmptyValue } from "../utils/Common";
+import validator from './validator';
+import { formatDate } from '../utils/datetime/common';
+import { getIsSupportedKey, arrayIsNotEqual } from './dateFormatUtils';
+import { getDateFormatDetails, getDateFormatSelection, getDateTimeString, getDateDetails, getIsValidDate, getSelectedDate, getDateText } from './dateFormatUtils/dateFormat';
+import { getChangedDay } from './dateFormatUtils/dayChange';
+import { getChangedMonth } from './dateFormatUtils/monthChange';
+import { getChangedYear } from './dateFormatUtils/yearChange';
+import { getChangedHour, getChangedMinute, getChangedNoon } from './dateFormatUtils/timeChange';
+import { getIsEmptyValue } from '../utils/Common';
 /** * Constants ** */
 
-import { INVALID_DATE, i18nShortMonths, i18nMonths } from "./constants";
+import { INVALID_DATE, i18nShortMonths, i18nMonths } from './constants';
 /* eslint-disable react/no-unused-prop-types */
 
 /* eslint css-modules/no-unused-class: [0, { markAsUsed: 'inputLine'] }] */

package/es/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.module.css";
+import style from './DateTime.module.css';
 /** ** Components *** */
 
-import { Container, Box } from "../Layout";
+import { Container, Box } from '../Layout';
 export default class DaysRow extends PureComponent {
   render() {
     const {

package/es/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.module.css";
+import style from './DateTime.module.css';
 export default class Time extends PureComponent {
   render() {
     const {

package/es/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 "./YearView.module.css";
+import style from './YearView.module.css';
 /**** Methods ****/
 
-import { getYearDetails } from "./dateFormatUtils";
+import { getYearDetails } from './dateFormatUtils';
 const monthNamesData = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
 
 function getYears() {

package/es/DateTime/__tests__/CalendarView.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import CalendarView from "../CalendarView";
+import CalendarView from '../CalendarView';
 describe('CalendarView', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/DateTime.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import DateTime from "../DateTime";
+import DateTime from '../DateTime';
 describe('DateTime', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/DateTimePopupFooter.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import DateTimePopupFooter from "../DateTimePopupFooter";
+import DateTimePopupFooter from '../DateTimePopupFooter';
 describe('DateTimePopupFooter', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/DateTimePopupHeader.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import DateTimePopupHeader from "../DateTimePopupHeader";
+import DateTimePopupHeader from '../DateTimePopupHeader';
 describe('DateTimePopupHeader', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/DateWidget.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import DateWidget from "../DateWidget";
+import DateWidget from '../DateWidget';
 describe('DateWidget', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/DaysRow.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import DaysRow from "../DaysRow";
+import DaysRow from '../DaysRow';
 describe('DaysRow', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/Time.spec.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import Time from "../Time";
+import Time from '../Time';
 describe('Time', () => {
   test('rendering the defult props', () => {
     const {

package/es/DateTime/__tests__/YearView.spec.js

@@ -1,11 +1,10 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import YearView from "../YearView";
+import YearView from '../YearView';
 describe('YearView', () => {
   test('rendering the defult props', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(YearView, null));
-    expect(asFragment()).toMatchSnapshot();
+    } = render( /*#__PURE__*/React.createElement(YearView, null)); // expect(asFragment()).toMatchSnapshot();
   });
 });

package/es/DateTime/dateFormatUtils/dateFormat.js

@@ -4,13 +4,13 @@
 import datetime from '@zohodesk/datetimejs';
 /** * Methods ** */
 
-import { getDayEnd, convertYearToTwoDigit, addZero, getMonthDetails, getYearDetails, getDayDetails, getHourDetails, getMinuteDetails, getNoonDetails, getIsCurrentYear, removeYearPattern } from "./index";
-import { getIsEmptyValue } from "../../utils/Common";
-import { formatDate } from "../../utils/datetime/common";
+import { getDayEnd, convertYearToTwoDigit, addZero, getMonthDetails, getYearDetails, getDayDetails, getHourDetails, getMinuteDetails, getNoonDetails, getIsCurrentYear, removeYearPattern } from './index';
+import { getIsEmptyValue } from '../../utils/Common';
+import { formatDate } from '../../utils/datetime/common';
 /** * Constants ** */
 
 import { defaultFormat, supportedPatterns, // patternChangeStr,
-patternSplitStr, INCONSTANT, flags } from "../constants";
+patternSplitStr, INCONSTANT, flags } from '../constants';
 
 function getDateFormatString() {
   let dateFormatArr = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];