@zohodesk/components 1.0.0-temp-171 → 1.0.0-temp-172

package/es/common/common.module.css

@@ -516,10 +516,10 @@
 
 .fitContWidth {
   width: fit-content ;
-  width: undefined ;
+  width: -moz-fit-content ;
 }
 
 .fitContHeight {
   height: fit-content ;
-  height: undefined ;
+  height: -moz-fit-content ;
 }

package/lib/Buttongroup/Buttongroup.module.css

@@ -24,8 +24,7 @@
 }
 
 [dir=ltr] .footer {
-  --buttongroup_padding: var(--zd_size20) 0 var(--zd_size20) var(--zd_size60
-)    ;
+  --buttongroup_padding: var(--zd_size20) 0 var(--zd_size20) var(--zd_size60);
 }
 
 [dir=rtl] .footer {

package/lib/DateTime/DateTime.module.css

@@ -35,7 +35,7 @@
 .grid {
   width: var(--zd_size28) ;
   height: var(--zd_size28) ;
-  line-height: var(--zd_size18);
+  line-height: 1.38461538;
   text-align: center;
   padding: var(--zd_size4) 0 ;
   border-radius: 50%;
@@ -71,7 +71,7 @@
 
 .thMonYear {
   font-size: var(--zd_font_size13) ;
-  line-height: var(--zd_size24);
+  line-height: 1.8461538461538463;
   color: var(--zdt_datetime_datestr_text);
   composes: semibold;
   display: initial

package/lib/DateTime/YearView.module.css

@@ -9,7 +9,7 @@
 .month {
   width: 30.333%;
   font-size: var(--zd_font_size12) ;
-  line-height: var(--zd_size26);
+  line-height: 2.1666666666666665;
   height: var(--zd_size26) ;
   color: var(--zdt_yearview_month_text);
   text-align: center;

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

@@ -196,10 +196,7 @@
     position: absolute;
     height: var(--zd_size34) ;
     width: var(--zd_size34) ;
-    clip: rect(var(--zd_size3),
- undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined var(--zd_size29),
- undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined var(--zd_size17),
- undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined undefined var(--zd_size8)) ;
+    clip: rect(var(--zd_size3), var(--zd_size29), var(--zd_size17), var(--zd_size8)) ;
     padding: var(--zd_size4) ;
     display: flex;
     align-items: center;

package/lib/Label/Label.module.css

@@ -4,7 +4,7 @@
   --label_text_color: var(--zdt_label_default_text);
   --label_font_family: var(--zd_regular);
   --label_cursor: default;
-  --label_line_height: 18px;
+  --label_line_height: 1.2857142857142858;
 }
 .label {
   composes: varClass;

package/lib/ListItem/ListContainer.js

@@ -105,7 +105,7 @@ var ListContainer = function ListContainer(props) {
     eleRef: eleRef,
     tagName: isLink ? 'a' : 'li',
     "data-title": isDisabled ? disableTitle : title
-  }, options, customProps, a11y), children);
+  }, options, customProps), children);
 };
 
 ListContainer.defaultProps = _defaultProps.ListContainerDefaultProps;

package/lib/ListItem/ListItem.module.css

@@ -15,8 +15,7 @@
   /* listitem tick icon default variables */
   --listitem_tickicon_color: var(--zdt_listitem_default_tickicon);
 }[dir=ltr] .varClass {
-  --listitem_avatar_margin: 0 var(--zd_size15) 0 0
-    ;
+  --listitem_avatar_margin: 0 var(--zd_size15) 0 0;
 }[dir=rtl] .varClass {
   --listitem_avatar_margin: 0 0 0 var(--zd_size15);
 }
@@ -48,9 +47,7 @@
   --listitem_border_color: var(--zdt_listitem_active_border);
 }
 [dir=ltr] .small {
-  --listitem_padding: var(--zd_size7) var(--zd_size3) var(--zd_size7
-)    var(--zd_size5
-)    ;
+  --listitem_padding: var(--zd_size7) var(--zd_size3) var(--zd_size7) var(--zd_size5);
 }
 [dir=rtl] .small {
   --listitem_padding: var(--zd_size7) var(--zd_size5) var(--zd_size7) var(--zd_size3);
@@ -63,9 +60,7 @@
   --listitem_height: var(--zd_size48);
 }
 [dir=ltr] .large {
-  --listitem_padding: var(--zd_size10) var(--zd_size3) var(--zd_size10
-)    var(--zd_size25
-)    ;
+  --listitem_padding: var(--zd_size10) var(--zd_size3) var(--zd_size10) var(--zd_size25);
 }
 [dir=rtl] .large {
   --listitem_padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size3);
@@ -75,7 +70,7 @@
   composes: dotted from '../common/common.module.css';
 }
 .value, .multiLineValue {
-  line-height: var(--zd_size20);
+  line-height: 1.5384615384615385;
 }
 .multiLineValue{
   word-break: break-word;
@@ -185,25 +180,19 @@
   display: block;
 }
 [dir=ltr] .smallwithTick {
-  --listitem_padding: var(--zd_size7) var(--zd_size39) var(--zd_size7
-)    var(--zd_size5
-)    ;
+  --listitem_padding: var(--zd_size7) var(--zd_size39) var(--zd_size7) var(--zd_size5);
 }
 [dir=rtl] .smallwithTick {
   --listitem_padding: var(--zd_size7) var(--zd_size5) var(--zd_size7) var(--zd_size39);
 }
 [dir=ltr] .mediumwithTick {
-  --listitem_padding: var(--zd_size7) var(--zd_size39) var(--zd_size7
-)    var(--zd_size20
-)    ;
+  --listitem_padding: var(--zd_size7) var(--zd_size39) var(--zd_size7) var(--zd_size20);
 }
 [dir=rtl] .mediumwithTick {
   --listitem_padding: var(--zd_size7) var(--zd_size20) var(--zd_size7) var(--zd_size39);
 }
 [dir=ltr] .largewithTick {
-  --listitem_padding: var(--zd_size10) var(--zd_size39) var(--zd_size10
-)    var(--zd_size25
-)    ;
+  --listitem_padding: var(--zd_size10) var(--zd_size39) var(--zd_size10) var(--zd_size25);
 }
 [dir=rtl] .largewithTick {
   --listitem_padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size39);

package/lib/MultiSelect/Suggestions.js

@@ -110,8 +110,7 @@ var Suggestions = /*#__PURE__*/function (_React$PureComponent) {
         var isHighlight = hoverOption === index || id === hoverId ? true : false;
         var list_a11y = Object.assign({}, a11y, {
           ariaSelected: isActive,
-          ariaLabel: value,
-          'data-a11y-list-active': isHighlight
+          ariaLabel: value
         });
 
         var commonProps = _objectSpread({

package/lib/Ribbon/Ribbon.module.css

@@ -8,7 +8,7 @@
   --ribbon_box_shadow: none;
   --ribbon_border_width: 0;
   --ribbon_border_color: var(--zdt_ribbon_default_border);
-  --ribbon_line_height: normal;
+  --ribbon_line_height: 1.2;
 
   /* flag ribbon default variable */
 
@@ -212,13 +212,12 @@
   composes: dotted from '../common/common.module.css';
   display: block;
   --ribbon_text_color: var(--zdt_ribbon_white_text);
-  --ribbon_line_height: 20px;
+  --ribbon_line_height: 1.53846154;
   --ribbon_text_transform: uppercase;
 }
 
 [dir=ltr] .flag {
-  --ribbon_padding: var(--zd_size4) var(--zd_size24) var(--zd_size4) var(--zd_size6
-)    ;
+  --ribbon_padding: var(--zd_size4) var(--zd_size24) var(--zd_size4) var(--zd_size6);
 }
 
 [dir=rtl] .flag {
@@ -260,7 +259,7 @@
   --ribbon_text_color: var(--zdt_ribbon_white_text);
   --ribbon_text_transform: uppercase;
   --ribbon_padding: var(--zd_size6) var(--zd_size10);
-  --ribbon_line_height: 20px;
+  --ribbon_line_height: 1.53846154;
   text-align: center;
 }
 
@@ -370,7 +369,7 @@
 .sticker {
   display: block;
   height: var(--zd_size18) ;
-  line-height: var(--zd_size11);
+  line-height: 0.846153846;
   --ribbon_text_color: var(--zdt_ribbon_white_text);
   --ribbon_text_transform: uppercase;
   text-align: center;

package/lib/Select/Select.js

@@ -345,8 +345,7 @@ var SelectComponent = /*#__PURE__*/function (_Component) {
           isPopupOpen = _this$props4.isPopupOpen,
           onKeyDown = _this$props4.onKeyDown,
           isPopupOpenOnEnter = _this$props4.isPopupOpenOnEnter,
-          needCloseOnSelect = _this$props4.needCloseOnSelect,
-          isPopupReady = _this$props4.isPopupReady;
+          needCloseOnSelect = _this$props4.needCloseOnSelect;
       var _this$state2 = this.state,
           hoverIndex = _this$state2.hoverIndex,
           optionsNormalize = _this$state2.optionsNormalize;
@@ -393,12 +392,12 @@ var SelectComponent = /*#__PURE__*/function (_Component) {
         var _ref2 = option || {},
             id = _ref2.id;
 
-        if (isPopupReady && !(0, _Common.getIsEmptyValue)(id) && onChange) {
+        if (isPopupOpen && !(0, _Common.getIsEmptyValue)(id) && onChange) {
           onChange(id, optionsNormalize[id]);
           needCloseOnSelect && this.handlePopupClose(e);
         }
 
-        if (!isPopupReady && isPopupOpenOnEnter) {
+        if (!isPopupOpen && isPopupOpenOnEnter) {
           this.togglePopup(e);
         }
       } else if (keyCode === 27) {

package/lib/Tab/Tab.module.css

@@ -32,7 +32,7 @@
 }
 .alpha {
   font-size: var(--zd_font_size11) ;
-  line-height: var(--zd_size33);
+  line-height: 3;
   padding: 0 var(--zd_size18) ;
 }
 .tabAlpha {
@@ -55,7 +55,7 @@
 }
 .beta {
   font-size: var(--zd_font_size14) ;
-  line-height: var(--zd_size60);
+  line-height: 4.285714285714286;
   text-transform: capitalize;
   padding: 0 var(--zd_size4) ;
 }
@@ -78,7 +78,7 @@
 }
 .delta {
   font-size: var(--zd_font_size11) ;
-  line-height: var(--zd_size33);
+  line-height: 3;
   padding: 0 var(--zd_size4) ;
 }
 [dir=ltr] .delta {

package/lib/Tag/Tag.module.css

@@ -22,9 +22,8 @@
   --tag_icon_bg_color: var(--zdt_tag_icon_bg);
 }[dir=ltr] .varClass {
   --tag_closeicon_border_radius: 0 12px 12px 0 /*rtl: 12px 0 0 12px*/;
-  --tag_closeicon_padding: 0 var(--zd_size7) 0 var(--zd_size6
-)    ;
-  --tag_icon_margin: 0 0 0 var(--zd_size5) ;
+  --tag_closeicon_padding: 0 var(--zd_size7) 0 var(--zd_size6);
+  --tag_icon_margin: 0 0 0 var(--zd_size5);
 }[dir=rtl] .varClass {
   --tag_closeicon_border_radius: 12px 0 0 12px;
   --tag_closeicon_padding: 0 var(--zd_size6) 0 var(--zd_size7);

package/lib/TextBox/TextBox.module.css

@@ -14,7 +14,7 @@
   --textbox_letter_spacing: 0.1px;
   --textbox_padding: 0;
   --textbox_cursor: auto;
-  --textbox_line_height: 35px;
+  --textbox_line_height: 2.5;
 
   /* textbox placeholder default variable */
   --textbox_placeholder_text_color: var(--zdt_textbox_placeholder_text);
@@ -115,21 +115,21 @@
 }
 .xmedium {
   --textbox_height: var(--zd_size28);
-  --textbox_line_height: 28px;
+  --textbox_line_height: 2;
 }
 .medium {
   --textbox_height: var(--zd_size35);
-  --textbox_line_height: 35px;
+  --textbox_line_height: 2.5;
 }
 .small {
   --textbox_font_size: var(--zd_font_size12);
   --textbox_height: var(--zd_size28);
-  --textbox_line_height: 28px;
+  --textbox_line_height: 2.33333333333;
 }
 .xsmall {
   --textbox_font_size: var(--zd_font_size13);
   --textbox_height: var(--zd_size25);
-  --textbox_line_height: 25px;
+  --textbox_line_height: 1.92307692308;
 }
 .default,
 .primary,

package/lib/Textarea/Textarea.module.css

@@ -5,7 +5,7 @@
   --textarea_cursor: auto;
   --textarea_text_color: var(--zdt_textarea_default_text);
   --textarea_font_size: var(--zd_font_size14);
-  --textarea_line_height: 22px;
+  --textarea_line_height: 1.57142857;
   --textarea_padding: var(--zd_size2) 0;
   --textarea_height: var(--zd_size30);
 
@@ -98,13 +98,13 @@
   --textarea_font_size: var(--zd_font_size14);
   --textarea_padding: var(--zd_size4) 0 var(--zd_size2);
   --textarea_height: var(--zd_size28);
-  --textarea_line_height: 19px;
+  --textarea_line_height: 1.35714285714;
 }
 .xmedium {
   --textarea_font_size: var(--zd_font_size13);
   --textarea_padding: var(--zd_size4) 0 var(--zd_size2);
   --textarea_height: var(--zd_size25);
-  --textarea_line_height: 17px;
+  --textarea_line_height: 1.30769230769;
 }
 .small {
   --textarea_height: var(--zd_size30);

package/lib/Tooltip/Tooltip.module.css

@@ -17,7 +17,7 @@
   font-family: var(--zd_semibold);
   word-break: break-word;
   max-width: var(--zd_size420) ;
-  line-height: var(--zd_size20);
+  line-height: 1.5384615384615385;
   min-height: var(--zd_size24) ;
   overflow: hidden;
   background-color: var(--zdt_tooltip_default_bg);

package/lib/common/common.module.css

@@ -516,10 +516,10 @@
 
 .fitContWidth {
   width: fit-content ;
-  width: undefined ;
+  width: -moz-fit-content ;
 }
 
 .fitContHeight {
   height: fit-content ;
-  height: undefined ;
+  height: -moz-fit-content ;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-temp-171",
+  "version": "1.0.0-temp-172",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -61,8 +61,8 @@
     "@zohodesk-private/color-variable-preprocessor": "1.0.6",
     "@zohodesk-private/css-variable-migrator": "^1.0.7",
     "@zohodesk-private/node-plugins": "^1.0.0",
-    "@zohodesk-private/react-prop-validator": "^1.0.0",
-    "@zohodesk/a11y": "1.0.0-temp-1",
+    "@zohodesk-private/react-prop-validator": "1.1.0",
+    "@zohodesk/a11y": "2.1.0",
     "@zohodesk/docstool": "1.0.0-alpha-2",
     "@zohodesk/hooks": "2.0.2",
     "@zohodesk/icons": "1.0.10",
@@ -88,6 +88,6 @@
     "react-sortable-hoc": "^0.8.3",
     "@zohodesk/hooks": "2.0.2",
     "@zohodesk/utils": "1.3.13",
-    "@zohodesk/a11y": "../a11y"
+    "@zohodesk/a11y": "2.1.0"
   }
 }