@zohodesk/components 1.2.34 → 1.2.36

package/es/VelocityAnimation/VelocityAnimation/__tests__/VelocityAnimation.spec.js

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

package/es/VelocityAnimation/VelocityAnimation/__tests__/__snapshots__/VelocityAnimation.spec.js.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`VelocityAnimation rendering the defult props 1`] = `
+<DocumentFragment>
+  <div>
+     Test 
+  </div>
+</DocumentFragment>
+`;

package/es/VelocityAnimation/VelocityAnimationGroup/__tests__/VelocityAnimationGroup.spec.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import VelocityAnimationGroup from '../VelocityAnimationGroup';
+describe('VelocityAnimationGroup', () => {
+  test('rendering the defult props', () => {
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(VelocityAnimationGroup, null, /*#__PURE__*/React.createElement("div", null, " Test ")));
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering isActive is true', () => {
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(VelocityAnimationGroup, {
+      isActive: true
+    }, /*#__PURE__*/React.createElement("div", null, " Test ")));
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/es/VelocityAnimation/VelocityAnimationGroup/__tests__/__snapshots__/VelocityAnimationGroup.spec.js.snap

@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`VelocityAnimationGroup rendering isActive is true 1`] = `
+<DocumentFragment>
+  <div>
+     Test 
+  </div>
+</DocumentFragment>
+`;
+
+exports[`VelocityAnimationGroup rendering the defult props 1`] = `<DocumentFragment />`;

package/es/semantic/Button/__tests__/Button.spec.js

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

package/es/semantic/Button/__tests__/__snapshots__/Button.spec.js.snap

@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Button rendering the defult props 1`] = `
+<DocumentFragment>
+  <button
+    class="buttonReset "
+    data-id="semanticButton"
+    data-test-id="semanticButton"
+    type="button"
+    value="text"
+  >
+    Button
+  </button>
+</DocumentFragment>
+`;

package/es/v1/DateTime/DateWidget.js

@@ -1067,7 +1067,8 @@ class DateWidgetComponent extends React.Component {
       customProps: TextBoxProps
     }, /*#__PURE__*/React.createElement(Container, {
       align: "both",
-      onClick: isDisabled || isReadOnly ? null : this.handleDateIconClick
+      onClick: isDisabled || isReadOnly ? null : this.handleDateIconClick,
+      dataId: `${dataId}_datePicker`
     }, /*#__PURE__*/React.createElement(Icon, {
       name: "ZD-datepicker",
       size: "12"

package/es/v1/DropDown/DropDownSearch.js

@@ -16,7 +16,8 @@ export default function DropDownSearch(props) {
     textBoxSize,
     placeHolder,
     customClass,
-    getRef
+    getRef,
+    dataId
   } = props;
   let {
     searchClass = '',
@@ -36,7 +37,9 @@ export default function DropDownSearch(props) {
   }
 
   return /*#__PURE__*/React.createElement("div", {
-    className: `${style.search} ${style[`${size}Search`]} ${searchClass}`
+    className: `${style.search} ${style[`${size}Search`]} ${searchClass}`,
+    "data-id": dataId,
+    "data-test-id": dataId
   }, /*#__PURE__*/React.createElement(TextBox, {
     id: id,
     inputRef: getReference,

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

@@ -16,5 +16,6 @@ export const DropDownItem_defaultProps = {
 export const DropDownSearch_defaultProps = {
   size: 'medium',
   textBoxSize: 'medium',
-  customClass: {}
+  customClass: {},
+  dataId: 'DropDownSearch'
 };

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

@@ -58,7 +58,8 @@ export const DropDownSearch_propTypes = {
   customClass: PropTypes.shape({
     searchClass: PropTypes.string,
     customTextBox: PropTypes.string
-  })
+  }),
+  dataId: PropTypes.string
 };
 export const DropDownSeparator_propTypes = {
   customClass: PropTypes.string

package/es/v1/ListItem/ListItemWithCheckBox.js

@@ -75,7 +75,8 @@ const ListItemWithCheckBox = props => {
     customProps: ListItemProps,
     ...ContainerProps
   }, /*#__PURE__*/React.createElement(Box, {
-    className: style.iconBox
+    className: style.iconBox,
+    dataId: `${dataId ? dataId : value}_checkBox`
   }, /*#__PURE__*/React.createElement(CheckBox, {
     checked: checked,
     a11y: {

package/es/v1/ListItem/ListItemWithRadio.js

@@ -75,7 +75,8 @@ const ListItemWithRadio = props => {
     customProps: ListItemProps,
     ...ContainerProps
   }, /*#__PURE__*/React.createElement(Box, {
-    className: style.iconBox
+    className: style.iconBox,
+    dataId: `${dataId}_radio`
   }, /*#__PURE__*/React.createElement(Radio, {
     checked: checked,
     id: id,

package/es/v1/MultiSelect/AdvancedGroupMultiSelect.js

@@ -925,7 +925,8 @@ class AdvancedGroupMultiSelect extends React.Component {
       getRef: this.selectedOptionRef,
       onRemove: this.handleRemoveOption,
       onSelect: this.handleClickSelectedOption,
-      isGroupSelect: true
+      isGroupSelect: true,
+      dataId: `${dataId}_selectedOptions`
     }), /*#__PURE__*/React.createElement(Box, {
       flexible: true,
       className: style.wrapper,
@@ -999,7 +1000,8 @@ class AdvancedGroupMultiSelect extends React.Component {
           role: 'listbox',
           ariaMultiselectable: true
         },
-        alignBox: "row"
+        alignBox: "row",
+        dataId: `${dataId}_dropbox`
       }, /*#__PURE__*/React.createElement(Box, {
         flexible: true
       }, /*#__PURE__*/React.createElement(Card, {
@@ -1043,7 +1045,8 @@ class AdvancedGroupMultiSelect extends React.Component {
           listItemSize: listItemSize,
           a11y: {
             role: 'option'
-          }
+          },
+          dataId: `${dataId}_Options`
         }));
       }) : /*#__PURE__*/React.createElement(EmptyState, {
         options: revampedGroups,

package/es/v1/MultiSelect/AdvancedMultiSelect.js

@@ -429,7 +429,8 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
       isReadOnly: isReadOnly,
       getRef: this.selectedOptionRef,
       onRemove: this.handleRemoveOption,
-      onSelect: this.handleClickSelectedOption
+      onSelect: this.handleClickSelectedOption,
+      dataId: `${dataIdMultiSelectComp}_selectedOptions`
     }), moreCount > 0 ? /*#__PURE__*/React.createElement(Box, {
       className: style.more,
       onClick: this.handleMoreClick,
@@ -438,7 +439,8 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
       flexible: true,
       className: style.wrapper,
       adjust: true,
-      shrink: true
+      shrink: true,
+      dataId: `${dataIdMultiSelectComp}_textBox`
     }, /*#__PURE__*/React.createElement("span", {
       className: ` ${style.custmSpan} ${textBoxSize === 'xmedium' ? style.custmSpanXmedium : style.custmSpanMedium} ${isShowClearIcon ? style.clearIconSpace : ''}
               `
@@ -505,6 +507,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
           role: 'listbox',
           ariaMultiselectable: true
         },
+        dataId: `${dataIdMultiSelectComp}_dropbox`,
         ...DropBoxProps,
         alignBox: "row",
         isResponsivePadding: getFooter ? false : true
@@ -537,6 +540,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
         a11y: {
           role: 'option'
         },
+        dataId: `${dataIdMultiSelectComp}_Options`,
         ...SuggestionsProps
       }) : /*#__PURE__*/React.createElement(EmptyState, {
         isLoading: isFetchingOptions,

package/es/v1/MultiSelect/MultiSelect.js

@@ -901,7 +901,8 @@ export class MultiSelectComponent extends React.Component {
       onRemove: this.handleRemoveOption,
       onSelect: this.handleClickSelectedOption,
       size: size,
-      palette: palette
+      palette: palette,
+      dataId: `${dataId}_selectedOptions`
     }), /*#__PURE__*/React.createElement(Box, {
       flexible: true,
       className: style.wrapper,
@@ -1039,7 +1040,8 @@ export class MultiSelectComponent extends React.Component {
       },
       size: boxSize,
       alignBox: "row",
-      isResponsivePadding: getFooter ? false : true
+      isResponsivePadding: getFooter ? false : true,
+      dataId: `${dataId}_dropbox`
     }, /*#__PURE__*/React.createElement(Box, {
       flexible: true
     }, /*#__PURE__*/React.createElement(Card, {

package/es/v1/MultiSelect/MultiSelectWithAvatar.js

@@ -134,7 +134,8 @@ class MultiSelectWithAvatarComponent extends MultiSelectComponent {
         role: 'listbox'
       },
       isResponsivePadding: true,
-      alignBox: "row"
+      alignBox: "row",
+      dataId: `${dataId}_dropbox`
     }, /*#__PURE__*/React.createElement(Box, {
       flexible: true
     }, /*#__PURE__*/React.createElement(Card, {

package/es/v1/MultiSelect/SelectedOptions.js

@@ -21,7 +21,8 @@ export default class SelectedOptions extends React.PureComponent {
       onRemove,
       onSelect,
       size,
-      palette
+      palette,
+      dataId
     } = this.props;
     const isDarkPalette = palette === 'dark' ? 'dark' : 'danger';
     return /*#__PURE__*/React.createElement(React.Fragment, null, selectedOptions.map(option => {
@@ -49,7 +50,8 @@ export default class SelectedOptions extends React.PureComponent {
       if (optionType === 'avatar') {
         return /*#__PURE__*/React.createElement(Box, {
           className: `${style.tag} ${style[size]}`,
-          key: `${id}photoTag`
+          key: `${id}photoTag`,
+          dataId: dataId
         }, /*#__PURE__*/React.createElement(Tag, { ...commonProps,
           active: highLightedSelectOptions.indexOf(id) >= 0,
           hasAvatar: true,
@@ -58,7 +60,8 @@ export default class SelectedOptions extends React.PureComponent {
       } else if (optionType === 'icon') {
         return /*#__PURE__*/React.createElement(Box, {
           className: `${style.tag} ${style[size]}`,
-          key: `${id}iconTag`
+          key: `${id}iconTag`,
+          dataId: dataId
         }, /*#__PURE__*/React.createElement(Tag, { ...commonProps,
           active: highLightedSelectOptions.indexOf(id) >= 0,
           iconName: icon,
@@ -68,7 +71,8 @@ export default class SelectedOptions extends React.PureComponent {
 
       return /*#__PURE__*/React.createElement(Box, {
         className: `${style.tag} ${style[size]}`,
-        key: `${id}tag`
+        key: `${id}tag`,
+        dataId: dataId
       }, /*#__PURE__*/React.createElement(Tag, { ...commonProps,
         active: highLightedSelectOptions.indexOf(id) >= 0
       }));

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

@@ -149,7 +149,8 @@ export const MultiSelectWithAvatar_defaultProps = {
   needResponsive: true
 };
 export const SelectedOptions_defaultProps = {
-  size: 'medium'
+  size: 'medium',
+  dataId: 'selectedOptions'
 };
 export const Suggestions_defaultProps = {
   a11y: {}

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

@@ -139,7 +139,8 @@ export const SelectedOptions_propTypes = {
     optionType: PropTypes.string
   })),
   size: PropTypes.oneOf(['medium', 'xmedium']),
-  palette: PropTypes.string
+  palette: PropTypes.string,
+  dataId: PropTypes.string
 };
 export const Suggestions_propTypes = {
   a11y: PropTypes.shape({

package/es/v1/Select/SelectWithAvatar.js

@@ -209,7 +209,8 @@ class SelectWithAvatarComponent extends SelectComponent {
       size: tagSize
     })) : null, /*#__PURE__*/React.createElement(Box, {
       flexible: true,
-      className: style.textBox
+      className: style.textBox,
+      dataId: `${dataId}_textBox`
     }, /*#__PURE__*/React.createElement(Textbox, {
       a11y: {
         ariaActivedescendant: selectedId,
@@ -257,7 +258,8 @@ class SelectWithAvatarComponent extends SelectComponent {
         needResponsive: needResponsive,
         isPadding: false,
         isResponsivePadding: true,
-        alignBox: "row"
+        alignBox: "row",
+        dataId: `${dataId}_dropbox`
       }, isLoading ? /*#__PURE__*/React.createElement(Container, {
         align: "both",
         className: style.loader
@@ -295,6 +297,7 @@ class SelectWithAvatarComponent extends SelectComponent {
           role: 'heading'
         }
       })) : null, suggestions.length ? /*#__PURE__*/React.createElement(Suggestions, {
+        dataId: `${dataId}_Options`,
         activeId: selectedId,
         suggestions: suggestions,
         getRef: this.suggestionItemRef,

package/es/v1/Select/SelectWithIcon.js

@@ -379,7 +379,8 @@ class SelectWithIcon extends Component {
     }, /*#__PURE__*/React.createElement(Icon, {
       name: iconName,
       size: iconSize,
-      iconClass: iconClass
+      iconClass: iconClass,
+      dataId: `${dataId}_icon`
     })) : null, /*#__PURE__*/React.createElement(Box, {
       flexible: true
     }, /*#__PURE__*/React.createElement(TextBoxIcon, {
@@ -472,7 +473,8 @@ class SelectWithIcon extends Component {
       }))) : null, /*#__PURE__*/React.createElement(CardContent, {
         customClass: `${tabletMode ? style.responsivedropBoxList : style.dropBoxList} ${!tabletMode && dropBoxSize ? style[dropBoxSize] : ''}`,
         shrink: true,
-        eleRef: this.scrollContentRef
+        eleRef: this.scrollContentRef,
+        dataId: `${dataId}_Options`
       }, options.length ? /*#__PURE__*/React.createElement(React.Fragment, null, options.map((options, i) => {
         let {
           iconName,

package/es/v1/Tab/Tabs.js

@@ -443,13 +443,15 @@ const Tabs = props => {
         ...DropBoxProps,
         isResponsivePadding: true,
         needFocusScope: true,
-        onClose: togglePopupLocal
+        onClose: togglePopupLocal,
+        dataId: `${dataId}_dropbox`
       }, getCustomDropBoxHeaderPlaceHolder && getCustomDropBoxHeaderPlaceHolder(props), /*#__PURE__*/React.createElement(Box, {
         flexible: true,
         shrink: true,
         scroll: "vertical",
         className: `${tabletMode ? '' : tabsStyle.menuBox} ${moreBoxClass}`,
-        onScroll: onScrollLocal
+        onScroll: onScrollLocal,
+        dataId: `${dataId}_Tabs`
       }, React.Children.map(moreTabs, child => {
         if (!child) {
           return null;

package/lib/Accordion/__tests__/Accordion.spec.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _Accordion = _interopRequireDefault(require("../Accordion"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('Accordion', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Accordion["default"], null)),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/lib/Accordion/__tests__/AccordionItem.spec.js

@@ -0,0 +1,24 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _AccordionItem = _interopRequireDefault(require("../AccordionItem"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('AccordionItem', function () {
+  test('rendering the defult props', function () {
+    var mockOnClick = jest.fn();
+    var mockSelectMenu = jest.fn();
+
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionItem["default"], {
+      onRemove: mockOnClick,
+      selectMenu: mockSelectMenu
+    }, /*#__PURE__*/_react["default"].createElement("div", null, " Accordin list "), /*#__PURE__*/_react["default"].createElement("div", null, " Accordin list2 "))),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/lib/Accordion/__tests__/__snapshots__/Accordion.spec.js.snap

@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Accordion rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class=""
+    data-id="Accordion"
+    data-selector-id="accordion"
+    data-test-id="Accordion"
+  />
+</DocumentFragment>
+`;

package/lib/Accordion/__tests__/__snapshots__/AccordionItem.spec.js.snap

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`AccordionItem rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class=""
+    data-id="AccordionItem"
+    data-selector-id="accordionItem"
+    data-test-id="AccordionItem"
+  >
+    <div
+      class=""
+    >
+      <div>
+         Accordin list 
+      </div>
+    </div>
+    <div>
+       Accordin list2 
+    </div>
+  </div>
+</DocumentFragment>
+`;

package/lib/Animation/__tests__/Animation.spec.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _Animation = _interopRequireDefault(require("../Animation"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('Animation', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Animation["default"], {
+      isActive: true,
+      name: "zoomIn"
+    }, /*#__PURE__*/_react["default"].createElement("div", null, " Test Animation"))),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/lib/Animation/__tests__/__snapshots__/Animation.spec.js.snap

@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Animation rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="zoomInEnter zoomInEnterActive"
+  >
+     Test Animation
+  </div>
+</DocumentFragment>
+`;

package/lib/Card/__tests__/Card.spec.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _Card = _interopRequireDefault(require("../Card"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('Card', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Card["default"], null)),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap

@@ -0,0 +1,12 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Card rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="flex cover coldir"
+    data-id="containerComponent"
+    data-selector-id="container"
+    data-test-id="containerComponent"
+  />
+</DocumentFragment>
+`;

package/lib/DateTime/DateWidget.js

@@ -1091,7 +1091,8 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
         customProps: TextBoxProps
       }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         align: "both",
-        onClick: isDisabled || isReadOnly ? null : this.handleDateIconClick
+        onClick: isDisabled || isReadOnly ? null : this.handleDateIconClick,
+        dataId: "".concat(dataId, "_datePicker")
       }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
         name: "ZD-datepicker",
         size: "12"

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

@@ -0,0 +1,20 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _CalendarView = _interopRequireDefault(require("../CalendarView"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('CalendarView', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_CalendarView["default"], {
+      dayNames: []
+    })),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

package/lib/DateTime/__tests__/DateTime.spec.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _DateTime = _interopRequireDefault(require("../DateTime"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('DateTime', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateTime["default"], null)),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering the isActive is true and isDefaultPosition is true', function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateTime["default"], {
+      isActive: true,
+      isDefaultPosition: true,
+      value: "2023-07-29T20:20:20.000"
+    })),
+        asFragment = _render2.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

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

@@ -0,0 +1,18 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _DateTimePopupFooter = _interopRequireDefault(require("../DateTimePopupFooter"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('DateTimePopupFooter', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateTimePopupFooter["default"], null)),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

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

@@ -0,0 +1,18 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _DateTimePopupHeader = _interopRequireDefault(require("../DateTimePopupHeader"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('DateTimePopupHeader', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_DateTimePopupHeader["default"], null)),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});