@zohodesk/components 1.2.34 → 1.2.36

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

@@ -0,0 +1,34 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DateTimePopupFooter rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="footer flex rowdir vCenter"
+    data-id="containerComponent"
+    data-selector-id="container"
+    data-test-id="containerComponent"
+  >
+    <button
+      class="bold primaryfilled medium"
+      data-id="DateTimePopupFooter_saveBtn"
+      data-selector-id="button"
+      data-test-id="DateTimePopupFooter_saveBtn"
+      type="button"
+    >
+      Button
+    </button>
+    <span
+      class="space"
+    />
+    <button
+      class="bold secondary medium"
+      data-id="DateTimePopupFooter_clearBtn"
+      data-selector-id="button"
+      data-test-id="DateTimePopupFooter_clearBtn"
+      type="button"
+    >
+      Button
+    </button>
+  </div>
+</DocumentFragment>
+`;

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

@@ -0,0 +1,72 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DateTimePopupHeader rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="header flex cover rowdir both"
+    data-id="containerComponent"
+    data-selector-id="container"
+    data-test-id="containerComponent"
+  >
+    <div
+      class="dateText shrinkOff"
+      data-id="selectYear"
+      data-selector-id="box"
+      data-test-id="selectYear"
+    >
+      <h2
+        class="reset thMonYear"
+        tabindex="0"
+      />
+      <span>
+        <i
+          aria-hidden="true"
+          class="zd_font_icons basic icon-dropdown  downArrow  "
+          data-id="fontIcon"
+          data-selector-id="fontIcon"
+          data-test-id="fontIcon"
+          style="--zd-iconfont-size: var(--zd_font_size12);"
+        />
+      </span>
+    </div>
+    <div
+      class="grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    />
+    <div
+      aria-label="prevMonth"
+      class="thArrow grid  shrinkOff"
+      data-id="prevMonth"
+      data-selector-id="box"
+      data-test-id="prevMonth"
+      tabindex="0"
+    >
+      <i
+        aria-hidden="true"
+        class="zd_font_icons basic icon-arrow-left3 fbold   rtl "
+        data-id="fontIcon"
+        data-selector-id="fontIcon"
+        data-test-id="fontIcon"
+      />
+    </div>
+    <div
+      aria-label="nextMonth"
+      class="thArrow grid navigation shrinkOff"
+      data-id="nextMonth"
+      data-selector-id="box"
+      data-test-id="nextMonth"
+      tabindex="0"
+    >
+      <i
+        aria-hidden="true"
+        class="zd_font_icons basic icon-arrow-right3 fbold   rtl "
+        data-id="fontIcon"
+        data-selector-id="fontIcon"
+        data-test-id="fontIcon"
+      />
+    </div>
+  </div>
+</DocumentFragment>
+`;

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

@@ -0,0 +1,79 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DateWidget rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="container"
+  >
+    <div
+      class=" textBox  enabled"
+      data-id="dateWidget_widget"
+      data-test-id="dateWidget_widget"
+    >
+      <div
+        class="container effect  placeHolder  flex rowdir"
+        data-id="containerComponent"
+        data-selector-id="textBoxIcon"
+        data-test-id="containerComponent"
+      >
+        <div
+          class="grow basis shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <input
+            autocomplete="off"
+            class=" pointer container medium  default  effect  borderColor_default  "
+            data-id="dateWidget"
+            data-selector-id="textBoxIcon"
+            data-test-id="dateWidget"
+            maxlength="250"
+            type="text"
+            value="MM/dd/yyyy"
+          />
+        </div>
+        <div
+          class="iconContainer  shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <div
+            class="flex cover rowdir"
+            data-id="containerComponent"
+            data-selector-id="container"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="icon  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <div
+                class="flex cover coldir both"
+                data-id="dateWidget_datePicker"
+                data-selector-id="container"
+                data-test-id="dateWidget_datePicker"
+              >
+                <i
+                  aria-hidden="true"
+                  class="zd_font_icons basic icon-Datepicker    "
+                  data-id="fontIcon"
+                  data-selector-id="fontIcon"
+                  data-test-id="fontIcon"
+                  style="--zd-iconfont-size: var(--zd_font_size12);"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="line borderColor_default "
+        />
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

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

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

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

@@ -0,0 +1,310 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Time rendering the defult props 1`] = `
+<DocumentFragment>
+  <span
+    class="text"
+  />
+  <div
+    class="timesection flex rowdir vCenter"
+    data-id="Time_timeContainer"
+    data-selector-id="container"
+    data-test-id="Time_timeContainer"
+  >
+    <div
+      class="dropDownContainer grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="container box_small   "
+        data-selector-id="select"
+      >
+        <div
+          class=""
+          data-id="hourField"
+          data-test-id="hourField"
+        >
+          <div
+            class="container effect  input  flex rowdir"
+            data-id="containerComponent"
+            data-selector-id="textBoxIcon"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="grow basis shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <input
+                aria-controls="1"
+                aria-expanded="false"
+                aria-haspopup="true"
+                aria-label="click to select options"
+                aria-owns="1"
+                aria-readonly="true"
+                autocomplete="off"
+                class=" pointer container xmedium  primary  effect  borderColor_default inputDotted "
+                data-id="hourField_textBox"
+                data-selector-id="textBoxIcon"
+                data-test-id="hourField_textBox"
+                maxlength="2"
+                placeholder=""
+                readonly=""
+                role="Menuitem"
+                type="text"
+                value=""
+              />
+            </div>
+            <div
+              class="iconContainer  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <div
+                class="flex cover rowdir"
+                data-id="containerComponent"
+                data-selector-id="container"
+                data-test-id="containerComponent"
+              >
+                <div
+                  class="icon  shrinkOff"
+                  data-id="boxComponent"
+                  data-selector-id="box"
+                  data-test-id="boxComponent"
+                >
+                  <div
+                    class="flex cover rowdir both"
+                    data-id="containerComponent"
+                    data-selector-id="container"
+                    data-test-id="containerComponent"
+                  >
+                    <div
+                      aria-hidden="true"
+                      class="arrowIcon flex cover coldir both"
+                      data-id="hourField_downIcon"
+                      data-selector-id="container"
+                      data-test-id="hourField_downIcon"
+                    >
+                      <i
+                        aria-hidden="true"
+                        class="zd_font_icons basic icon-down    "
+                        data-id="fontIcon"
+                        data-selector-id="fontIcon"
+                        data-test-id="fontIcon"
+                        style="--zd-iconfont-size: var(--zd_font_size7);"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              class="line borderColor_default "
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="dropDownContainer grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="container box_small   "
+        data-selector-id="select"
+      >
+        <div
+          class=""
+          data-id="minuteField"
+          data-test-id="minuteField"
+        >
+          <div
+            class="container effect  input  flex rowdir"
+            data-id="containerComponent"
+            data-selector-id="textBoxIcon"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="grow basis shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <input
+                aria-controls="3"
+                aria-expanded="false"
+                aria-haspopup="true"
+                aria-label="click to select options"
+                aria-owns="3"
+                aria-readonly="true"
+                autocomplete="off"
+                class=" pointer container xmedium  primary  effect  borderColor_default inputDotted "
+                data-id="minuteField_textBox"
+                data-selector-id="textBoxIcon"
+                data-test-id="minuteField_textBox"
+                maxlength="2"
+                placeholder=""
+                readonly=""
+                role="Menuitem"
+                type="text"
+                value=""
+              />
+            </div>
+            <div
+              class="iconContainer  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <div
+                class="flex cover rowdir"
+                data-id="containerComponent"
+                data-selector-id="container"
+                data-test-id="containerComponent"
+              >
+                <div
+                  class="icon  shrinkOff"
+                  data-id="boxComponent"
+                  data-selector-id="box"
+                  data-test-id="boxComponent"
+                >
+                  <div
+                    class="flex cover rowdir both"
+                    data-id="containerComponent"
+                    data-selector-id="container"
+                    data-test-id="containerComponent"
+                  >
+                    <div
+                      aria-hidden="true"
+                      class="arrowIcon flex cover coldir both"
+                      data-id="minuteField_downIcon"
+                      data-selector-id="container"
+                      data-test-id="minuteField_downIcon"
+                    >
+                      <i
+                        aria-hidden="true"
+                        class="zd_font_icons basic icon-down    "
+                        data-id="fontIcon"
+                        data-selector-id="fontIcon"
+                        data-test-id="fontIcon"
+                        style="--zd-iconfont-size: var(--zd_font_size7);"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              class="line borderColor_default "
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="dropDownContainer grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="container box_small   "
+        data-selector-id="select"
+      >
+        <div
+          class=""
+          data-id="ampmField"
+          data-test-id="ampmField"
+        >
+          <div
+            class="container effect  input  flex rowdir"
+            data-id="containerComponent"
+            data-selector-id="textBoxIcon"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="grow basis shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <input
+                aria-controls="5"
+                aria-expanded="false"
+                aria-haspopup="true"
+                aria-label="click to select options"
+                aria-owns="5"
+                aria-readonly="true"
+                autocomplete="off"
+                class=" pointer container xmedium  primary  effect  borderColor_default inputDotted "
+                data-id="ampmField_textBox"
+                data-selector-id="textBoxIcon"
+                data-test-id="ampmField_textBox"
+                maxlength="2"
+                placeholder=""
+                readonly=""
+                role="Menuitem"
+                type="text"
+                value=""
+              />
+            </div>
+            <div
+              class="iconContainer  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="box"
+              data-test-id="boxComponent"
+            >
+              <div
+                class="flex cover rowdir"
+                data-id="containerComponent"
+                data-selector-id="container"
+                data-test-id="containerComponent"
+              >
+                <div
+                  class="icon  shrinkOff"
+                  data-id="boxComponent"
+                  data-selector-id="box"
+                  data-test-id="boxComponent"
+                >
+                  <div
+                    class="flex cover rowdir both"
+                    data-id="containerComponent"
+                    data-selector-id="container"
+                    data-test-id="containerComponent"
+                  >
+                    <div
+                      aria-hidden="true"
+                      class="arrowIcon flex cover coldir both"
+                      data-id="ampmField_downIcon"
+                      data-selector-id="container"
+                      data-test-id="ampmField_downIcon"
+                    >
+                      <i
+                        aria-hidden="true"
+                        class="zd_font_icons basic icon-down    "
+                        data-id="fontIcon"
+                        data-selector-id="fontIcon"
+                        data-test-id="fontIcon"
+                        style="--zd-iconfont-size: var(--zd_font_size7);"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              class="line borderColor_default "
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

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

@@ -0,0 +1,61 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`YearView rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="container virtualizer"
+    dataid="yearList"
+  >
+    <div
+      style="order: 0; height: 0px; width: 1px; flex-grow: 0; flex-shrink: 0;"
+    />
+    <div
+      class="yearBox flex coldir"
+      data-id="containerComponent"
+      data-selector-id="container"
+      data-test-id="containerComponent"
+      style="order: 0;"
+    >
+      <div
+        class="year  shrinkOff"
+        data-id="year_1850"
+        data-selector-id="box"
+        data-test-id="year_1850"
+      >
+        <div
+          class="flex cover rowdir vCenter"
+          data-id="containerComponent"
+          data-selector-id="container"
+          data-test-id="containerComponent"
+        >
+          <div
+            class="grow basis shrinkOff"
+            data-id="boxComponent"
+            data-selector-id="box"
+            data-test-id="boxComponent"
+          >
+            <h4
+              class="reset yearText"
+              data-title="1850"
+              tabindex="0"
+            >
+              1850
+            </h4>
+          </div>
+          <i
+            aria-hidden="true"
+            class="zd_font_icons basic icon-arrow-down-single fbold arrow  "
+            data-id="fontIcon"
+            data-selector-id="fontIcon"
+            data-test-id="fontIcon"
+            style="--zd-iconfont-size: var(--zd_font_size7);"
+          />
+        </div>
+      </div>
+    </div>
+    <div
+      style="order: 8150; height: 8149px; width: 1px; flex-grow: 0; flex-shrink: 0;"
+    />
+  </div>
+</DocumentFragment>
+`;

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

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

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

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`DropBoxElement 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/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/DropDownSearch.js

@@ -37,14 +37,17 @@ 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}`,
+      "data-id": dataId,
+      "data-test-id": dataId
     }, /*#__PURE__*/React.createElement(TextBox, {
       id: id,
       inputRef: this.getRef,