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

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

@@ -1,191 +1,191 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Buttongrop -  Checking the "customclass" 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup undefined customClassButtonGroup"
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignleft"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the "buttonPosition" to  - center 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup undefined "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="aligncenter"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the "buttonPosition" to  - left 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup undefined "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignleft"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the "buttonPosition" to  - right 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup undefined "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignright"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the "type"   - footer 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup footer "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignleft"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the "type"   - header 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup header "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignleft"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the "type"   - tab 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup tab "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignleft"
-    >
-      <span>
-        Element 1
-      </span>
-      <span>
-        Element 2
-      </span>
-      <span>
-        Element 3
-      </span>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`Buttongrop -  rendering the default props 1`] = `
-<DocumentFragment>
-  <div
-    class="buttonGroup undefined "
-    data-id="ButtonGroup"
-    data-selector-id="buttonGroup"
-    data-test-id="ButtonGroup"
-  >
-    <div
-      class="alignleft"
-    />
-  </div>
-</DocumentFragment>
-`;
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Buttongrop -  Checking the "customclass" 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup undefined customClassButtonGroup"
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignleft"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the "buttonPosition" to  - center 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup undefined "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="aligncenter"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the "buttonPosition" to  - left 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup undefined "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignleft"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the "buttonPosition" to  - right 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup undefined "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignright"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the "type"   - footer 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup footer "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignleft"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the "type"   - header 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup header "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignleft"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the "type"   - tab 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup tab "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignleft"
+    >
+      <span>
+        Element 1
+      </span>
+      <span>
+        Element 2
+      </span>
+      <span>
+        Element 3
+      </span>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Buttongrop -  rendering the default props 1`] = `
+<DocumentFragment>
+  <div
+    class="buttonGroup undefined "
+    data-id="ButtonGroup"
+    data-selector-id="buttonGroup"
+    data-test-id="ButtonGroup"
+  >
+    <div
+      class="alignleft"
+    />
+  </div>
+</DocumentFragment>
+`;

package/lib/Card/Card.js

@@ -47,10 +47,10 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 
 /* eslint-disable react/forbid-component-props */
 
-/*
-isscroll header border change use ref
-scroll logic remove from here
-scroll logic move to virtualizer list
+/*
+isscroll header border change use ref
+scroll logic remove from here
+scroll logic move to virtualizer list
 */
 
 /* performance handling pending in card component moving to ref instead of setState */

package/lib/Card/Card.module.css

@@ -1,20 +1,20 @@
-.notScroll {
-  position: relative;
-}
-.scroll {
-  /* background: var(--dot_white);
-  position: relative; */
-}
-/*
-.scroll::after {
-  box-shadow: 0 0 6px var(--zd_dark10);
-  border-radius: 100px / 10px;
-  content: '';
-  left: var(--zd_size50);
-  position: absolute;
-  right: var(--zd_size50);
-  display: block;
-  z-index: -1;
-  height: var(--zd_size1);
-  bottom: 0;
-} */
+.notScroll {
+  position: relative;
+}
+.scroll {
+  /* background: var(--dot_white);
+  position: relative; */
+}
+/*
+.scroll::after {
+  box-shadow: 0 0 6px var(--zd_dark10);
+  border-radius: 100px / 10px;
+  content: '';
+  left: var(--zd_size50);
+  position: absolute;
+  right: var(--zd_size50);
+  display: block;
+  z-index: -1;
+  height: var(--zd_size1);
+  bottom: 0;
+} */

package/lib/DateTime/DateTime.module.css

@@ -122,8 +122,7 @@
   color: var(--zdt_datetime_invalid_text);
 }
 
-.invalidDate.sunday,
-.inActiveDate.sunday:hover {
+.invalidDate.sunday,.inActiveDate.sunday:hover {
   color: var(--zdt_datetime_invaliddate_text);
 }
 
@@ -148,17 +147,15 @@
   background-color: var(--zdt_datetime_selected_bg);
   border-radius: 50%;
 }
-
-.inActiveDate {
-  color: var(--zdt_datetime_invalid_text);
-  cursor: no-drop;
+.inActiveDate{
+color: var(--zdt_datetime_invalid_text);
+cursor: no-drop;
 }
-
-.inActiveDate:hover {
+.inActiveDate:hover
+{
   color: var(--zdt_datetime_invalid_text);
 }
-
-.inActiveDate:hover, .inActiveDate.sunday:hover {
+.inActiveDate:hover, .inActiveDate.sunday:hover{
   background-color: var(--zdt_datetime_inactivedate_hover_bg);
 
 }
@@ -247,6 +244,6 @@
 .dropBox {
   width: 100% ;
   border-radius: 3px;
-  box-shadow: var(--zd_bs_contrast_outline, 0 3px 30px var(--zdt_dropbox_default_box_shadow));
+  box-shadow: var(--zd_bs_dropbox_bottom);
   background-color: var(--zdt_dropbox_default_bg);
 }

package/lib/DateTime/DateWidget.module.css

@@ -1,38 +1,38 @@
-/* $Id */
-.container {
-  position: relative;
-  composes: offSelection from '../common/common.module.css';
-}
-.readOnly, .readOnly > input, .disabled {
-  cursor: not-allowed;
-}
-.enabled {
-  cursor: pointer;
-}
-.textBox {
-  position: relative;
-}
-.inputLine {
-  position: absolute;
-  bottom: 0 ;
-  transition: border var(--zd_transition2) linear 0s;
-  border-bottom: 1px solid var(--zdt_datewidget_input_border);
-}
-[dir=ltr] .inputLine {
-  left: 0 ;
-  right: 0 ;
-}
-[dir=rtl] .inputLine {
-  right: 0 ;
-  left: 0 ;
-}
-.enabled:hover .inputLine {
-  border-bottom-color: var(--zdt_datewidget_enabled_border);
-}
-.textBoxFocus .inputLine {
-  border-bottom-color: var(--zdt_datewidget_textboxfocus_border);
-}
-
-.placeHolder input {
-  color: var(--zdt_datewidget_placeholder_text);
-}
+/* $Id */
+.container {
+  position: relative;
+  composes: offSelection from '../common/common.module.css';
+}
+.readOnly, .readOnly > input, .disabled {
+  cursor: not-allowed;
+}
+.enabled {
+  cursor: pointer;
+}
+.textBox {
+  position: relative;
+}
+.inputLine {
+  position: absolute;
+  bottom: 0 ;
+  transition: border var(--zd_transition2) linear 0s;
+  border-bottom: 1px solid var(--zdt_datewidget_input_border);
+}
+[dir=ltr] .inputLine {
+  left: 0 ;
+  right: 0 ;
+}
+[dir=rtl] .inputLine {
+  right: 0 ;
+  left: 0 ;
+}
+.enabled:hover .inputLine {
+  border-bottom-color: var(--zdt_datewidget_enabled_border);
+}
+.textBoxFocus .inputLine {
+  border-bottom-color: var(--zdt_datewidget_textboxfocus_border);
+}
+
+.placeHolder input {
+  color: var(--zdt_datewidget_placeholder_text);
+}

package/lib/DropBox/DropBoxElement/css/DropBoxElement.module.css

@@ -74,23 +74,23 @@
 
 /* shadow */
 .top_shadow {
-    --dropbox_box_shadow: var(--zd_bs_contrast_outline, 0 -3px 30px var(--zdt_dropbox_default_box_shadow));
+    --dropbox_box_shadow: var(--zd_bs_dropbox_top);
 }
 
 .left_shadow {
-    --dropbox_box_shadow: var(--zd_bs_contrast_outline, -4px 0 30px var(--zdt_dropbox_default_box_shadow));
+    --dropbox_box_shadow: var(--zd_bs_dropbox_left);
 }
 
 .right_shadow {
-    --dropbox_box_shadow: var(--zd_bs_contrast_outline, 4px 0 30px var(--zdt_dropbox_default_box_shadow));
+    --dropbox_box_shadow: var(--zd_bs_dropbox_right);
 }
 
 .bottom_shadow {
-    --dropbox_box_shadow: var(--zd_bs_contrast_outline, 0 3px 30px var(--zdt_dropbox_default_box_shadow));
+    --dropbox_box_shadow: var(--zd_bs_dropbox_bottom);
 }
 
 .defaultShadow {
-    box-shadow: var(--zd_bs_contrast_outline, 4px 3px 30px var(--zdt_dropbox_default_box_shadow));
+    box-shadow: var(--zd_bs_dropbox_default);
 }
 
 /* box direction styles */
@@ -206,7 +206,7 @@
 .arrowShape {
     height: var(--zd_size10) ;
     width: var(--zd_size10) ;
-    box-shadow: var(--zd_bs_contrast_outline, 1px -1px 2px 0 var(--dropbox_arrow_box_shadow_color));
+    box-shadow: 1px -1px 2px 0 var(--dropbox_arrow_box_shadow_color);
     background-color: var(--dropbox_bg_color);
     -webkit-transform: rotateZ(-45deg);
     transform: rotateZ(-45deg);
@@ -342,21 +342,17 @@
     composes: animationBasic;
     composes: fadeIn modeForward from '../../../common/animation.module.css';
 }
-
 .scaleIn {
     composes: animationBasic;
     composes: scaleIn from '../../../common/animation.module.css';
 }
-
 .bounce {
     composes: animationBasic;
 }
-
 [dir=ltr] .bounce {
     animation-name: animation;
     animation-timing-function: cubic-bezier(0.4, 1, 0.65, 1.1);
 }
-
 [dir=rtl] .bounce {
     animation-name: animation;
     animation-timing-function: cubic-bezier(0.4, 1, 0.65, 1.1);
@@ -418,7 +414,7 @@
 }
 
 .closeBar {
-    /*  Variable:Ignore  */
+  /*  Variable:Ignore  */
     height: 6px;
     width: 20% ;
     border-radius: 5px;