@zohodesk/components 1.2.34 → 1.2.36

package/lib/DropDown/DropDownSearch.js

@@ -83,13 +83,16 @@ var DropDownSearch = /*#__PURE__*/function (_React$Component) {
           size = _this$props.size,
           textBoxSize = _this$props.textBoxSize,
           placeHolder = _this$props.placeHolder,
-          customClass = _this$props.customClass;
+          customClass = _this$props.customClass,
+          dataId = _this$props.dataId;
       var _customClass$searchCl = customClass.searchClass,
           searchClass = _customClass$searchCl === void 0 ? '' : _customClass$searchCl,
           _customClass$customTe = customClass.customTextBox,
           customTextBox = _customClass$customTe === void 0 ? '' : _customClass$customTe;
       return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(_DropDownSearchModule["default"].search, " ").concat(_DropDownSearchModule["default"]["".concat(size, "Search")], " ").concat(searchClass)
+        className: "".concat(_DropDownSearchModule["default"].search, " ").concat(_DropDownSearchModule["default"]["".concat(size, "Search")], " ").concat(searchClass),
+        "data-id": dataId,
+        "data-test-id": dataId
       }, /*#__PURE__*/_react["default"].createElement(_TextBox["default"], {
         id: id,
         inputRef: this.getRef,

package/lib/DropDown/__tests__/DropDown.spec.js

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

package/lib/DropDown/__tests__/DropDownHeading.spec.js

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

package/lib/DropDown/__tests__/DropDownItem.spec.js

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

package/lib/DropDown/__tests__/DropDownSearch.spec.js

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

package/lib/DropDown/__tests__/DropDownSeparator.spec.js

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

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

@@ -0,0 +1,51 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DropDown rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="popup"
+  >
+    <div
+      class="target"
+    >
+      <div>
+        test 1
+      </div>
+    </div>
+    <div
+      class="main hidden container bottomMid default"
+      data-a11y-focus-main-area="true"
+      data-id="dropBox"
+      data-position="bottomMid"
+      data-selector-id="dropBox"
+      data-test-id="dropBox"
+    >
+      <div
+        class="subContainer bottom_shadow radius defaultPalette"
+        data-id="dropBox_subcontainer"
+        data-selector-id="dropBox_subcontainer"
+        data-test-id="dropBox_subcontainer"
+        tabindex="-1"
+      >
+        <div
+          class="flex rowdir"
+          data-id="containerComponent"
+          data-selector-id="container"
+          data-test-id="containerComponent"
+        >
+          <div
+            class="grow basis shrinkOn scrolly"
+            data-id="boxComponent"
+            data-selector-id="box"
+            data-test-id="boxComponent"
+          >
+            <div>
+              test 2
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

package/lib/DropDown/__tests__/__snapshots__/DropDownHeading.spec.js.snap

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

package/lib/DropDown/__tests__/__snapshots__/DropDownItem.spec.js.snap

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

package/lib/DropDown/__tests__/__snapshots__/DropDownSearch.spec.js.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DropDownSearch rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="search mediumSearch "
+    data-id="DropDownSearch"
+    data-test-id="DropDownSearch"
+  >
+    <input
+      class="  container medium  default border effect  borderColor_default  "
+      data-id="textBox"
+      data-selector-id="textBox"
+      data-test-id="textBox"
+      type="text"
+      value=""
+    />
+  </div>
+</DocumentFragment>
+`;

package/lib/DropDown/__tests__/__snapshots__/DropDownSeparator.spec.js.snap

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

package/lib/DropDown/props/defaultProps.js

@@ -25,6 +25,7 @@ exports.DropDownItem_defaultProps = DropDownItem_defaultProps;
 var DropDownSearch_defaultProps = {
   size: 'medium',
   textBoxSize: 'medium',
-  customClass: {}
+  customClass: {},
+  dataId: 'DropDownSearch'
 };
 exports.DropDownSearch_defaultProps = DropDownSearch_defaultProps;

package/lib/DropDown/props/propTypes.js

@@ -79,7 +79,7 @@ var DropDownSearch_propTypes = (_DropDownSearch_propT = {
 }, _defineProperty(_DropDownSearch_propT, "placeHolder", _propTypes["default"].string), _defineProperty(_DropDownSearch_propT, "size", _propTypes["default"].oneOf(['small', 'medium'])), _defineProperty(_DropDownSearch_propT, "textBoxSize", _propTypes["default"].string), _defineProperty(_DropDownSearch_propT, "value", _propTypes["default"].string), _defineProperty(_DropDownSearch_propT, "customClass", _propTypes["default"].shape({
   searchClass: _propTypes["default"].string,
   customTextBox: _propTypes["default"].string
-})), _DropDownSearch_propT);
+})), _defineProperty(_DropDownSearch_propT, "dataId", _propTypes["default"].string), _DropDownSearch_propT);
 exports.DropDownSearch_propTypes = DropDownSearch_propTypes;
 var DropDownSeparator_propTypes = {
   customClass: _propTypes["default"].string

package/lib/Heading/__tests__/Heading.spec.js

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

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

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Heading rendering the defult props 1`] = `
+<DocumentFragment>
+  <h1
+    class="reset "
+  />
+</DocumentFragment>
+`;

package/lib/Layout/__tests__/Box.spec.js

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

package/lib/Layout/__tests__/Container.spec.js

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

package/lib/Layout/__tests__/__snapshots__/Box.spec.js.snap

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

package/lib/Layout/__tests__/__snapshots__/Container.spec.js.snap

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

package/lib/ListItem/ListItemWithCheckBox.js

@@ -150,7 +150,8 @@ var ListItemWithCheckBox = /*#__PURE__*/function (_React$Component) {
         title: null,
         customProps: ListItemProps
       }, ContainerProps), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-        className: _ListItemModule["default"].iconBox
+        className: _ListItemModule["default"].iconBox,
+        dataId: "".concat(dataId ? dataId : value, "_checkBox")
       }, /*#__PURE__*/_react["default"].createElement(_CheckBox["default"], {
         checked: checked,
         a11y: {

package/lib/ListItem/ListItemWithRadio.js

@@ -151,7 +151,8 @@ var ListItemWithRadio = /*#__PURE__*/function (_React$Component) {
         title: null,
         customProps: ListItemProps
       }, ContainerProps), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-        className: _ListItemModule["default"].iconBox
+        className: _ListItemModule["default"].iconBox,
+        dataId: "".concat(dataId, "_radio")
       }, /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
         checked: checked,
         id: id,

package/lib/ListItem/__tests__/ListContainer.spec.js

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

package/lib/ListItem/__tests__/ListItem.spec.js

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

package/lib/ListItem/__tests__/ListItemWithAvatar.spec.js

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

package/lib/ListItem/__tests__/ListItemWithCheckBox.spec.js

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

package/lib/ListItem/__tests__/ListItemWithIcon.spec.js

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

package/lib/ListItem/__tests__/ListItemWithRadio.spec.js

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

package/lib/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap

@@ -0,0 +1,14 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ListContainer rendering the defult props 1`] = `
+<DocumentFragment>
+  <li
+    class="list medium  default     withBorder  flex rowdir vCenter"
+    data-a11y-inset-focus="true"
+    data-id="containerComponent"
+    data-selector-id="listContainer"
+    data-test-id="containerComponent"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;

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

@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ListItem rendering the defult props 1`] = `
+<DocumentFragment>
+  <li
+    class="list medium  default     withBorder  flex rowdir vCenter"
+    data-a11y-inset-focus="true"
+    data-id="listItem"
+    data-selector-id="listItem"
+    data-test-id="listItem"
+    role="option"
+    tabindex="0"
+  />
+</DocumentFragment>
+`;

package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ListItemWithAvatar rendering the defult props 1`] = `
+<DocumentFragment>
+  <li
+    class="list medium  default     withBorder  flex rowdir vCenter"
+    data-a11y-inset-focus="true"
+    data-id="List_ListItemWithAvatar"
+    data-selector-id="listItemWithAvatar"
+    data-test-id="List_ListItemWithAvatar"
+    role="option"
+    tabindex="0"
+  >
+    <div
+      class="value grow basis shrinkOn"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      List
+    </div>
+  </li>
+</DocumentFragment>
+`;

package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap

@@ -0,0 +1,71 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ListItemWithCheckBox rendering the defult props 1`] = `
+<DocumentFragment>
+  <li
+    class="list medium  default     withBorder  flex rowdir vCenter"
+    data-a11y-inset-focus="true"
+    data-id="List_ListItemWithCheckBox"
+    data-selector-id="listItemWithCheckBox"
+    data-test-id="List_ListItemWithCheckBox"
+    role="option"
+    tabindex="0"
+  >
+    <div
+      class="iconBox shrinkOff"
+      data-id="List_checkBox"
+      data-selector-id="box"
+      data-test-id="List_checkBox"
+    >
+      <div
+        aria-checked="false"
+        aria-hidden="true"
+        class="container pointer primary 
+          inflex rowdir vCenter"
+        data-id="checkBox"
+        data-selector-id="container"
+        data-test-id="checkBox"
+        role="checkbox"
+        tabindex="-1"
+      >
+        <div
+          class="boxContainer medium  filled shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <input
+            type="hidden"
+          />
+          <label
+            class="checkbox pointer medium "
+          >
+            <svg
+              viewBox="0 0 40 40"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <rect
+                class="cbBox"
+                height="38"
+                rx="4"
+                width="38"
+                x="1"
+                xmlns="http://www.w3.org/2000/svg"
+                y="1"
+              />
+            </svg>
+          </label>
+        </div>
+      </div>
+    </div>
+    <div
+      class="value grow basis shrinkOn"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      List
+    </div>
+  </li>
+</DocumentFragment>
+`;

package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap

@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ListItemWithIcon rendering the defult props 1`] = `
+<DocumentFragment>
+  <li
+    class="list medium  default     withBorder  flex rowdir vCenter"
+    data-a11y-inset-focus="true"
+    data-id="list"
+    data-selector-id="listItemWithIcon"
+    data-test-id="list"
+    role="option"
+    tabindex="0"
+  >
+    <div
+      class="value grow basis shrinkOn"
+      data-id="list_Text"
+      data-selector-id="box"
+      data-test-id="list_Text"
+    >
+      List
+    </div>
+  </li>
+</DocumentFragment>
+`;