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

package/es/DropBox/DropBoxPositionMapping.json

@@ -1,145 +1,145 @@
-{
-    "positionMapping": {
-        "bottomCenter": {
-            "direction": "bottom",
-            "arrowPosition": "mid",
-            "positionStyle": "bottomMid"
-        },
-        "bottomLeftToRight": {
-            "direction": "bottom",
-            "arrowPosition": "start",
-            "positionStyle": "bottomEnd"
-        },
-        "bottomCenterToRight": {
-            "direction": "bottom",
-            "arrowPosition": "start",
-            "positionStyle": "bottomEnd"
-        },
-        "bottomRightToLeft": {
-            "direction": "bottom",
-            "arrowPosition": "end",
-            "positionStyle": "bottomStart"
-        },
-        "bottomCenterToLeft": {
-            "direction": "bottom",
-            "arrowPosition": "end",
-            "positionStyle": "bottomStart"
-        },
-        "topCenter": {
-            "direction": "top",
-            "arrowPosition": "mid",
-            "positionStyle": "topMid"
-        },
-        "topLeftToRight": {
-            "direction": "top",
-            "arrowPosition": "start",
-            "positionStyle": "topEnd"
-        },
-        "topCenterToRight": {
-            "direction": "top",
-            "arrowPosition": "start",
-            "positionStyle": "topEnd"
-        },
-        "topRightToLeft": {
-            "direction": "top",
-            "arrowPosition": "end",
-            "positionStyle": "topStart"
-        },
-        "topCenterToLeft": {
-            "direction": "top",
-            "arrowPosition": "end",
-            "positionStyle": "topStart"
-        },
-        "rightCenter": {
-            "direction": "right",
-            "arrowPosition": "mid",
-            "positionStyle": "rightMid"
-        },
-        "rightTopToBottom": {
-            "direction": "right",
-            "arrowPosition": "start",
-            "positionStyle": "rightEnd"
-        },
-        "rightCenterToBottom": {
-            "direction": "right",
-            "arrowPosition": "start",
-            "positionStyle": "rightEnd"
-        },
-        "rightBottomToTop": {
-            "direction": "right",
-            "arrowPosition": "end",
-            "positionStyle": "rightStart"
-        },
-        "rightCenterToTop": {
-            "direction": "right",
-            "arrowPosition": "end",
-            "positionStyle": "rightStart"
-        },
-        "leftCenter": {
-            "direction": "left",
-            "arrowPosition": "mid",
-            "positionStyle": "leftMid"
-        },
-        "leftTopToBottom": {
-            "direction": "left",
-            "arrowPosition": "start",
-            "positionStyle": "leftEnd"
-        },
-        "leftCenterToBottom": {
-            "direction": "left",
-            "arrowPosition": "start",
-            "positionStyle": "leftEnd"
-        },
-        "leftBottomToTop": {
-            "direction": "left",
-            "arrowPosition": "end",
-            "positionStyle": "leftStart"
-        },
-        "leftCenterToTop": {
-            "direction": "left",
-            "arrowPosition": "end",
-            "positionStyle": "leftStart"
-        },
-        "bottomRight": {
-            "direction": "bottom",
-            "arrowPosition": "start",
-            "positionStyle": "bottomEnd"
-        },
-        "bottomLeft": {
-            "direction": "bottom",
-            "arrowPosition": "end",
-            "positionStyle": "bottomStart"
-        },
-        "topRight": {
-            "direction": "top",
-            "arrowPosition": "start",
-            "positionStyle": "topEnd"
-        },
-        "topLeft": {
-            "direction": "top",
-            "arrowPosition": "end",
-            "positionStyle": "topStart"
-        },
-        "rightBottom": {
-            "direction": "right",
-            "arrowPosition": "start",
-            "positionStyle": "rightEnd"
-        },
-        "rightTop": {
-            "direction": "right",
-            "arrowPosition": "end",
-            "positionStyle": "rightStart"
-        },
-        "leftBottom": {
-            "direction": "left",
-            "arrowPosition": "start",
-            "positionStyle": "leftEnd"
-        },
-        "leftTop": {
-            "direction": "left",
-            "arrowPosition": "end",
-            "positionStyle": "leftStart"
-        }
-    }
-}
+{
+    "positionMapping": {
+        "bottomCenter": {
+            "direction": "bottom",
+            "arrowPosition": "mid",
+            "positionStyle": "bottomMid"
+        },
+        "bottomLeftToRight": {
+            "direction": "bottom",
+            "arrowPosition": "start",
+            "positionStyle": "bottomEnd"
+        },
+        "bottomCenterToRight": {
+            "direction": "bottom",
+            "arrowPosition": "start",
+            "positionStyle": "bottomEnd"
+        },
+        "bottomRightToLeft": {
+            "direction": "bottom",
+            "arrowPosition": "end",
+            "positionStyle": "bottomStart"
+        },
+        "bottomCenterToLeft": {
+            "direction": "bottom",
+            "arrowPosition": "end",
+            "positionStyle": "bottomStart"
+        },
+        "topCenter": {
+            "direction": "top",
+            "arrowPosition": "mid",
+            "positionStyle": "topMid"
+        },
+        "topLeftToRight": {
+            "direction": "top",
+            "arrowPosition": "start",
+            "positionStyle": "topEnd"
+        },
+        "topCenterToRight": {
+            "direction": "top",
+            "arrowPosition": "start",
+            "positionStyle": "topEnd"
+        },
+        "topRightToLeft": {
+            "direction": "top",
+            "arrowPosition": "end",
+            "positionStyle": "topStart"
+        },
+        "topCenterToLeft": {
+            "direction": "top",
+            "arrowPosition": "end",
+            "positionStyle": "topStart"
+        },
+        "rightCenter": {
+            "direction": "right",
+            "arrowPosition": "mid",
+            "positionStyle": "rightMid"
+        },
+        "rightTopToBottom": {
+            "direction": "right",
+            "arrowPosition": "start",
+            "positionStyle": "rightEnd"
+        },
+        "rightCenterToBottom": {
+            "direction": "right",
+            "arrowPosition": "start",
+            "positionStyle": "rightEnd"
+        },
+        "rightBottomToTop": {
+            "direction": "right",
+            "arrowPosition": "end",
+            "positionStyle": "rightStart"
+        },
+        "rightCenterToTop": {
+            "direction": "right",
+            "arrowPosition": "end",
+            "positionStyle": "rightStart"
+        },
+        "leftCenter": {
+            "direction": "left",
+            "arrowPosition": "mid",
+            "positionStyle": "leftMid"
+        },
+        "leftTopToBottom": {
+            "direction": "left",
+            "arrowPosition": "start",
+            "positionStyle": "leftEnd"
+        },
+        "leftCenterToBottom": {
+            "direction": "left",
+            "arrowPosition": "start",
+            "positionStyle": "leftEnd"
+        },
+        "leftBottomToTop": {
+            "direction": "left",
+            "arrowPosition": "end",
+            "positionStyle": "leftStart"
+        },
+        "leftCenterToTop": {
+            "direction": "left",
+            "arrowPosition": "end",
+            "positionStyle": "leftStart"
+        },
+        "bottomRight": {
+            "direction": "bottom",
+            "arrowPosition": "start",
+            "positionStyle": "bottomEnd"
+        },
+        "bottomLeft": {
+            "direction": "bottom",
+            "arrowPosition": "end",
+            "positionStyle": "bottomStart"
+        },
+        "topRight": {
+            "direction": "top",
+            "arrowPosition": "start",
+            "positionStyle": "topEnd"
+        },
+        "topLeft": {
+            "direction": "top",
+            "arrowPosition": "end",
+            "positionStyle": "topStart"
+        },
+        "rightBottom": {
+            "direction": "right",
+            "arrowPosition": "start",
+            "positionStyle": "rightEnd"
+        },
+        "rightTop": {
+            "direction": "right",
+            "arrowPosition": "end",
+            "positionStyle": "rightStart"
+        },
+        "leftBottom": {
+            "direction": "left",
+            "arrowPosition": "start",
+            "positionStyle": "leftEnd"
+        },
+        "leftTop": {
+            "direction": "left",
+            "arrowPosition": "end",
+            "positionStyle": "leftStart"
+        }
+    }
+}
   

package/es/DropBox/__tests__/DropBox.spec.js

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

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

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DropBox rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="main hidden container bottomStart default"
+    data-a11y-focus-main-area="true"
+    data-id="dropBox"
+    data-position="bottomStart"
+    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="end"
+        data-id="dropBox_arrow"
+        data-selector-id="dropBox_arrow"
+        data-test-id="dropBox_arrow"
+      >
+        <div
+          class="arrowShape"
+        />
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

package/es/DropDown/DropDown.module.css

@@ -1,5 +1,5 @@
-.listGroup {
-  max-height: var(--zd_size220) ;
-  composes: oflowy from '../common/common.module.css';
-  margin: var(--zd_size8) 0 var(--zd_size4) ;
-}
+.listGroup {
+  max-height: var(--zd_size220) ;
+  composes: oflowy from '../common/common.module.css';
+  margin: var(--zd_size8) 0 var(--zd_size4) ;
+}

package/es/DropDown/DropDownSearch.js

@@ -37,14 +37,16 @@ export default class DropDownSearch extends React.Component {
       size,
       textBoxSize,
       placeHolder,
-      customClass
+      customClass,
+      dataId
     } = this.props;
     let {
       searchClass = '',
       customTextBox = ''
     } = customClass;
     return /*#__PURE__*/React.createElement("div", {
-      className: `${style.search} ${style[`${size}Search`]} ${searchClass}`
+      className: `${style.search} ${style[`${size}Search`]} ${searchClass}`,
+      dataId: dataId
     }, /*#__PURE__*/React.createElement(TextBox, {
       id: id,
       inputRef: this.getRef,

package/es/DropDown/DropDownSearch.module.css

@@ -1,14 +1,14 @@
-.varClass {
-  /* dropdownsearch default variables */
-  --dropdownsearch-padding: 0 var(--zd_size15) 0;
-}
-.search {
-  composes: varClass;
-  padding: var(--dropdownsearch-padding);
-}
-.smallSearch {
-  --dropdownsearch-padding: 0 var(--zd_size5) 0;
-}
-.mediumSearch {
-  --dropdownsearch-padding: 0 var(--zd_size15) 0;
-}
+.varClass {
+  /* dropdownsearch default variables */
+  --dropdownsearch-padding: 0 var(--zd_size15) 0;
+}
+.search {
+  composes: varClass;
+  padding: var(--dropdownsearch-padding);
+}
+.smallSearch {
+  --dropdownsearch-padding: 0 var(--zd_size5) 0;
+}
+.mediumSearch {
+  --dropdownsearch-padding: 0 var(--zd_size15) 0;
+}

package/es/DropDown/DropDownSeparator.module.css

@@ -1,7 +1,7 @@
-.separator {
-  height: var(--zd_size1) ;
-  border-width: 0 0 1px 0;
-  border-style: solid;
-  border-color: var(--zdt_dropdown_user_default_border);
-  margin: var(--zd_size5) 0 ;
-}
+.separator {
+  height: var(--zd_size1) ;
+  border-width: 0 0 1px 0;
+  border-style: solid;
+  border-color: var(--zdt_dropdown_user_default_border);
+  margin: var(--zd_size5) 0 ;
+}

package/es/DropDown/__tests__/DropDown.spec.js

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

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

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

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

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

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

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

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

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

package/es/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/es/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/es/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/es/DropDown/__tests__/__snapshots__/DropDownSearch.spec.js.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DropDownSearch rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="search mediumSearch "
+    dataid="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/es/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/es/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/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/Heading/Heading.module.css

@@ -1,5 +1,5 @@
-.reset {
-  font-size: inherit ;
-  font-weight: initial;
-  margin: initial ;
+.reset {
+  font-size: inherit ;
+  font-weight: initial;
+  margin: initial ;
 }

package/es/Heading/__tests__/Heading.spec.js

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

package/es/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/es/Label/Label.js

@@ -1,5 +1,5 @@
-/* eslint css-modules/no-unused-class: [2, { markAsUsed: [
-  'small', 'medium', 'large', 'title', 'subtitle', 'default', 'primary', 'secondary', 'danger', 'mandatory'
+/* eslint css-modules/no-unused-class: [2, { markAsUsed: [
+  'small', 'medium', 'large', 'title', 'subtitle', 'default', 'primary', 'secondary', 'danger', 'mandatory'
 ]}] */
 import React from 'react';
 import { defaultProps } from './props/defaultProps';