@zohodesk/components 1.0.0-temp-196.1 → 1.0.0-temp-200

package/es/Tag/props/defaultProps.js

@@ -7,7 +7,6 @@ export const defaultProps = {
   size: 'medium',
   dataId: 'tag',
   customClass: {},
-  customAttributes: {},
   a11y: {},
   needEffect: true,
   isReadOnly: false,

package/es/Tag/props/propTypes.js

@@ -26,7 +26,6 @@ export const propTypes = {
     customTagIcon: PropTypes.string,
     customAvatar: PropTypes.string
   }),
-  customAttributes: PropTypes.object,
   a11y: PropTypes.shape({
     clearLabel: PropTypes.string
   }),

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

@@ -16,7 +16,8 @@ export default function DropDownSearch(props) {
     textBoxSize,
     placeHolder,
     customClass,
-    getRef
+    getRef,
+    dataId
   } = props;
   let {
     searchClass = '',
@@ -48,7 +49,8 @@ export default function DropDownSearch(props) {
     size: textBoxSize,
     value: value,
     placeHolder: placeHolder,
-    customClass: customTextBox
+    customClass: customTextBox,
+    dataId: dataId
   }));
 }
 DropDownSearch.defaultProps = DropDownSearch_defaultProps;

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

@@ -84,7 +84,8 @@ const ListItemWithCheckBox = props => {
     customClass: {
       customCheckBox: customCheckBox,
       customLabel: customLabel
-    }
+    },
+    dataId: `${dataId}_checkBox`
   })), /*#__PURE__*/React.createElement(Box, {
     flexible: true,
     shrink: true,

package/es/v1/ListItem/ListItemWithRadio.js

@@ -85,7 +85,8 @@ const ListItemWithRadio = props => {
     customClass: {
       customRadio: customRadio,
       customRadioWrap: customRadioWrap
-    }
+    },
+    dataId: `${dataId}_radio`
   })), /*#__PURE__*/React.createElement(Box, {
     flexible: true,
     shrink: true,

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: `${dataId}_selectedOptions`
     }), moreCount > 0 ? /*#__PURE__*/React.createElement(Box, {
       className: style.more,
       onClick: this.handleMoreClick,
@@ -455,6 +456,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
       size: textBoxSize,
       value: searchStr,
       variant: variant,
+      dataId: `${dataId}_textBox`,
       isReadOnly: isReadOnly,
       tabindex: isDisabled && '-1',
       customClass: {
@@ -505,6 +507,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
           role: 'listbox',
           ariaMultiselectable: true
         },
+        dataId: `${dataId}_dropbox`,
         ...DropBoxProps,
         alignBox: "row",
         isResponsivePadding: getFooter ? false : true
@@ -537,6 +540,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
         a11y: {
           role: 'option'
         },
+        dataId: `${dataId}_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 => {
@@ -43,7 +44,8 @@ export default class SelectedOptions extends React.PureComponent {
         getRef: getRef,
         initial: value,
         id: id,
-        isReadOnly: isReadOnly
+        isReadOnly: isReadOnly,
+        dataId: dataId
       };
 
       if (optionType === 'avatar') {

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

@@ -238,7 +238,8 @@ class SelectWithAvatarComponent extends SelectComponent {
       isClickable: isReadOnly || isDisabled ? false : true,
       borderColor: borderColor,
       htmlId: htmlId,
-      autoComplete: false
+      autoComplete: false,
+      dataId: `${dataId}_textBox`
     }))), !isReadOnly && !isDisabled && isPopupOpen ? /*#__PURE__*/React.createElement(ResponsiveReceiver, {
       query: this.responsiveFunc,
       responsiveId: "Helmet"
@@ -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/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/es/v1/Tag/Tag.js

@@ -41,7 +41,6 @@ function Tag(props) {
     tooltip,
     avatarPalette,
     customClass,
-    customAttributes,
     a11y,
     needEffect,
     isReadOnly,
@@ -91,8 +90,7 @@ function Tag(props) {
     "data-title": tooltip ? tooltip : text,
     tabIndex: disabled ? '-1' : '0',
     "aria-labelledby": getAriaId,
-    "data-selector-id": dataSelectorId,
-    ...customAttributes
+    "data-selector-id": dataSelectorId
   }, hasAvatar ? /*#__PURE__*/React.createElement("div", {
     className: style.avatar
   }, /*#__PURE__*/React.createElement(Avatar, {

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

@@ -7,7 +7,6 @@ export const defaultProps = {
   size: 'medium',
   dataId: 'tag',
   customClass: {},
-  customAttributes: {},
   a11y: {},
   needEffect: true,
   isReadOnly: false,

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

@@ -26,7 +26,6 @@ export const propTypes = {
     customTagIcon: PropTypes.string,
     customAvatar: PropTypes.string
   }),
-  customAttributes: PropTypes.object,
   a11y: PropTypes.shape({
     clearLabel: PropTypes.string
   }),

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/__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: "2024-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();
+  });
+});

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

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