@zohodesk/dot 1.0.0-temp-167 → 1.0.0-temp-169

package/es/Drawer/Drawer.js

@@ -73,10 +73,7 @@ export class Header extends React.Component {
       shrink: true
     }, /*#__PURE__*/React.createElement(Heading, {
       title: title,
-      className: style.title,
-      a11y: {
-        tabindex: '0'
-      }
+      className: style.title
     })) : null, getTitleChildren ? /*#__PURE__*/React.createElement(Box, null, getTitleChildren()) : null)) : null, children ? /*#__PURE__*/React.createElement(Box, null, children) : null)), onClose ? /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(IconButton, {
       onClick: onClose,
       dataId: "closeButton",
@@ -161,7 +158,7 @@ export default class Drawer extends React.Component {
       needRestoreFocus = true,
       needListNavigation = false,
       needFocusLoop = true,
-      needEnterAction = false
+      needEnterAction = true
     } = focusScopeProps;
     let childrenWithProps = React.Children.map(children, child => {
       if (child.type === Header || child.type === Footer || child.type === Content) {

package/es/ImportantNotes/ImportantNotes.module.css

@@ -2,23 +2,19 @@
   background: var(--zdt_importantnotes_bg);
   padding: var(--zd_size5) var(--zd_size10) ;
 }
-
 .title {
   font-size: var(--zd_font_size13) ;
-  line-height: 1.3846;
+  line-height: var(--zd_font_size18);
   color: var(--zdt_importantnotes_title_text);
 }
-
 .icon {
   color: var(--zdt_importantnotes_icon);
   font-size: 0 ;
   margin-top: var(--zd_size1) ;
 }
-
 [dir=ltr] .icon {
   margin-right: var(--zd_size5) ;
 }
-
 [dir=rtl] .icon {
   margin-left: var(--zd_size5) ;
-}
+}

package/es/Link/Link.js

@@ -92,8 +92,7 @@ export default class Link extends React.Component {
     }, others, {
       onClick: this.onCallBack.bind(this, urlOutput, href)
     }, customProps, {
-      "aria-label": ariaLabel,
-      tabIndex: "0"
+      "aria-label": ariaLabel
     }), children);
   }
 

package/es/ToastMessage/ToastMessage.module.css

@@ -177,14 +177,14 @@
 .alertMessage {
   font-size: var(--zd_font_size12) ;
   composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
-  line-height: 1.3333;
+  line-height: var(--zd_size16);
   color: var(--zdt_toastmessage_alert_text);
   margin-top: var(--zd_size5) ;
 }
 
 .buttonText {
   font-size: inherit ;
-  line-height: normal;
+  line-height: var(--zd_size14);
   text-align: center;
   padding: 0 var(--zd_size7) ;
   cursor: pointer;

package/es/Upload/Upload.module.css

@@ -88,7 +88,7 @@
   width: var(--zd_size12) ;
   top: 0 ;
   position: absolute;
-  line-height: 0.8333;
+  line-height: var(--zd_size10);
   font-size: var(--zd_font_size12) ;
   text-align: center;
 }

package/es/alert/AlertLookup/AlertLookup.module.css

@@ -3,7 +3,7 @@
 }
 
 .innerSection {
-  line-height: 1.6667;
+  line-height: var(--zd_size25);
   color: var(--zdt_alertlookup_innersection_text);
   font-size: var(--zd_font_size15) ;
   word-break: break-word;

package/es/avatar/AvatarStatus/AvatarStatus.js

@@ -39,7 +39,6 @@ export default class AvatarStatus extends React.Component {
     return /*#__PURE__*/React.createElement("div", _extends({
       className: `${style.container} ${className} `
     }, AvatarStatusProps, {
-      tabIndex: "0",
       "aria-label": `${title}, ${name}, ${statusTitle}`,
       "data-selector-id": dataSelectorId
     }), /*#__PURE__*/React.createElement(Avatar, _extends({

package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css

@@ -58,11 +58,8 @@
 [dir=rtl] .linkDesc, [dir=rtl] .desc {
   margin-left: var(--zd_size4) ;
 }
-.small .desc {
-  line-height: 1.584;
-}
-.medium .desc {
-  line-height: 1.358;
+.desc {
+  line-height: var(--zd_size19);
 }
 .link {
   /* css:theme-validation:ignore */

package/es/errorstate/EmptyStates.module.css

@@ -33,15 +33,15 @@
 }
 .title {
   font-size: var(--zd_font_size50) ;
-  line-height: 1.4;
+  line-height: var(--zd_size70);
 }
 .tabletTitle {
   font-size: var(--zd_font_size24) ;
-  line-height: 2.0833;
+  line-height: var(--zd_size50);
 }
 .mobileTitle {
   font-size: var(--zd_font_size22) ;
-  line-height: 1.3636;
+  line-height: var(--zd_size30);
 }
 .subtitle {
   font-size: var(--zd_font_size30) ;

package/es/errorstate/PermissionPlay/PermissionPlay.module.css

@@ -13,7 +13,7 @@
   font-size: var(--zd_font_size30) ;
 }
 .lastBox {
-  line-height: 1.7143;
+  line-height: var(--zd_size24);
   font-size: var(--zd_font_size14) ;
   margin: 0 auto ;
   margin-bottom: var(--zd_size20) ;

package/es/form/fields/Fields.module.css

@@ -169,7 +169,7 @@
   color: var(--zdt_fields_phitag_text);
   font-size: var(--zd_font_size12) ;
   height: var(--zd_size18) ;
-  line-height: 1.5;
+  line-height: var(--zd_size18);
   background-color: var(--zdt_fields_phitag_bg);
   border: 1px solid var(--zdt_fields_phitag_border);
   padding: 0 var(--zd_size5) ;

package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css

@@ -12,7 +12,7 @@
   font-size: var(--zd_font_size12) ;
   display: inline-block;
   color: var(--zdt_setupdetail_backicon);
-  line-height: 2.5;
+  line-height: var(--zd_size30);
   text-align: center;
   border-radius: 50%;
   cursor: pointer;
@@ -29,7 +29,7 @@
 }
 .title {
   font-size: var(--zd_font_size16) ;
-  line-height: 1;
+  line-height: var(--zd_size16);
   font-family: var(--zd_semibold);
   color: var(--zdt_setupdetail_backicon);
   composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
@@ -57,7 +57,7 @@
   padding: var(--zd_size12) 0 0 var(--zd_size15) ;
 }
 .helpInfo {
-  line-height: 2.3636;
+  line-height: var(--zd_size26);
   height: var(--zd_size28) ;
   width: var(--zd_size28) ;
   color: var(--zdt_setupdetail_helpinfo_text);
@@ -120,7 +120,7 @@
   height: var(--zd_size26) ;
   width: var(--zd_size26) ;
   font-size: var(--zd_font_size12) ;
-  line-height: 2;
+  line-height: var(--zd_size24);
   text-align: center;
   border: 1px solid var(--zdt_setupdetail_infoicon_border);
   border-radius: 2px;

package/es/list/ListLayout/ListLayout.js

@@ -43,7 +43,7 @@ export default class ListLayout extends Component {
       "data-id": dataId,
       "data-test-id": dataId,
       "data-title": dataTitle,
-      tabIndex: "0",
+      tabIndex: onClick ? '0' : null,
       role: role,
       "data-a11y-inset-focus": true,
       "aria-label": ariaLabel,

package/es/list/status/StatusDropdown/StatusDropdown.js

@@ -335,8 +335,8 @@ export class StatusDropdown extends React.Component {
       dataId: dataId,
       onClick: removeClose,
       disabled: isDisabled || isReadOnly ? true : false,
-      "aria-haspopup": true,
-      "aria-expanded": isPopupOpen && isEditable ? true : false,
+      "aria-haspopup": isSearch ? 'listbox' : 'menu',
+      "aria-expanded": isPopupReady && isEditable ? true : false,
       tabIndex: tabIndex,
       "aria-labelledby": ariaLabelledby,
       "aria-label": ariaLabel,
@@ -395,10 +395,10 @@ export class StatusDropdown extends React.Component {
         inputRef: this.searchInputRef,
         onKeyDown: this.handleKeyDown,
         a11y: {
-          ariaHaspopup: true,
-          ariaExpanded: true,
+          ariaHaspopup: isSearch ? 'listbox' : 'menu',
+          ariaExpanded: isPopupReady,
           role: 'combobox',
-          ariaActivedescendant: value,
+          ariaActivedescendant: isPopupReady ? value : '',
           ariaOwns: ariaTitleId
         }
       })) : null, title && options.length != 0 && /*#__PURE__*/React.createElement(Box, {
@@ -420,7 +420,7 @@ export class StatusDropdown extends React.Component {
         onScroll: this.handleScroll,
         role: isSearch ? 'listbox' : 'menu',
         "aria-labelledby": ariaTitleId,
-        tabindex: "0"
+        tabindex: "-1"
       }, options.length != 0 && isDataLoaded ? /*#__PURE__*/React.createElement(React.Fragment, null, options.map((item, i) => /*#__PURE__*/React.createElement(React.Fragment, {
         key: i
       }, /*#__PURE__*/React.createElement(StatusListItem, {

package/es/list/status/StatusListItem/StatusListItem.module.css

@@ -31,7 +31,7 @@
   padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size3) ;
 }
 .value,.multiLineValue {
-  line-height: 1.5385;
+  line-height: var(--zd_size20);
 }
 .value {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';

package/es/lookup/Lookup/Lookup.js

@@ -71,7 +71,7 @@ export default class Lookup extends Component {
       needRestoreFocus = true,
       needListNavigation = false,
       needFocusLoop = true,
-      needEnterAction = false
+      needEnterAction = true
     } = focusScopeProps;
     const content = /*#__PURE__*/React.createElement("div", {
       ref: this.createRef,

package/es/lookup/header/Close/LookupClose.module.css

@@ -1,7 +1,7 @@
 .container {
   width: var(--zd_size25) ;
   height: var(--zd_size25) ;
-  line-height: 2.7778;
+  line-height: var(--zd_size25);
   color: var(--zdt_lookupclose_default_text);
   transition: var(--zd_transition2) cubic-bezier(0.4, 1, 0.65, 1);
   font-size: var(--zd_font_size9) ;

package/es/lookup/header/ViewDropDown/ViewDropDown.module.css

@@ -26,7 +26,7 @@
 /* Label Style */
 .labelCnt {
   composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
-  line-height: 1.6667;
+  line-height: var(--zd_size20);
   color: var(--zdt_viewdropdown_label_text);
   cursor: pointer;
 }

package/es/setup/helptips/Description/HelpTipsDescription.module.css

@@ -1,6 +1,6 @@
 .text {
   font-size: var(--zd_font_size14) ;
   color: var(--zdt_helptips_text);
-  line-height: 1.7143;
+  line-height: var(--zd_size24);
   margin: var(--zd_size10) 0 ;
 }

package/es/v1/ActionButton/ActionButton.js

@@ -40,13 +40,18 @@ function ActionButton(props) {
     innerClassName,
     popupGroup,
     togglePopup,
-    defaultPosition
+    defaultPosition,
+    openPopupOnly
   } = props;
 
   const handleTogglePopup = e => {
     togglePopup(e, defaultPosition);
   };
 
+  const handlePopupOpen = e => {
+    openPopupOnly(e, defaultPosition);
+  };
+
   return /*#__PURE__*/React.createElement(Container, {
     alignBox: "row",
     isCover: false,
@@ -94,7 +99,7 @@ function ActionButton(props) {
     "data-title": removeChildrenTooltip ? null : subText,
     className: style.subTxt
   }, subText) : null)), children ? /*#__PURE__*/React.createElement(Box, {
-    onClick: onClick ? !onHover && handleTogglePopup : undefined,
+    onClick: onClick && !onHover ? handleTogglePopup : handlePopupOpen,
     onMouseEnter: onClick ? onHover && handleTogglePopup : undefined,
     onMouseLeave: onClick ? onHover && handleTogglePopup : undefined,
     className: `${btnStyle.buttonReset} ${style[arrowBoxSize + '_arrowBox']} ${style[palette + 'Arw']}  ${style.arrowWrapper} ${isPopupOpen ? style.arrowActive : ''}`,

package/es/v1/Drawer/Drawer.js

@@ -72,10 +72,7 @@ export function Header(props) {
     shrink: true
   }, /*#__PURE__*/React.createElement(Heading, {
     title: title,
-    className: style.title,
-    a11y: {
-      tabindex: '0'
-    }
+    className: style.title
   })) : null, getTitleChildren ? /*#__PURE__*/React.createElement(Box, null, getTitleChildren()) : null)) : null, children ? /*#__PURE__*/React.createElement(Box, null, children) : null)), onClose ? /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(IconButton, {
     onClick: onClose,
     dataId: "closeButton",
@@ -147,7 +144,7 @@ export default function Drawer(props) {
       needRestoreFocus = true,
       needListNavigation = false,
       needFocusLoop = true,
-      needEnterAction = false
+      needEnterAction = true
     } = focusScopeProps;
     let childrenWithProps = React.Children.map(children, child => {
       if (child.type === Header || child.type === Footer || child.type === Content) {

package/es/v1/Link/Link.js

@@ -84,8 +84,7 @@ export default function Link(props) {
   }, others, {
     onClick: callBack
   }, customProps, {
-    "aria-label": ariaLabel,
-    tabIndex: "0"
+    "aria-label": ariaLabel
   }), children);
 }
 Link.defaultProps = defaultProps;

package/es/v1/avatar/AvatarStatus/AvatarStatus.js

@@ -34,7 +34,6 @@ export default function AvatarStatus(props) {
   return /*#__PURE__*/React.createElement("div", _extends({
     className: `${style.container} ${className} `
   }, AvatarStatusProps, {
-    tabIndex: "0",
     "aria-label": `${title}, ${name}, ${statusTitle}`,
     "data-selector-id": dataSelectorId
   }), /*#__PURE__*/React.createElement(Avatar, _extends({

package/es/v1/list/ListLayout/ListLayout.js

@@ -38,7 +38,7 @@ export default function ListLayout(props) {
     "data-id": dataId,
     "data-test-id": dataId,
     "data-title": dataTitle,
-    tabIndex: "0",
+    tabIndex: onClick ? '0' : null,
     role: role,
     "data-a11y-inset-focus": true,
     "aria-label": ariaLabel,

package/es/v1/list/status/StatusDropdown/StatusDropdown.js

@@ -247,8 +247,8 @@ function StatusDropdown(props) {
     dataId: dataId,
     onClick: removeClose,
     disabled: isDisabled || isReadOnly ? true : false,
-    "aria-haspopup": true,
-    "aria-expanded": isPopupOpen && isEditable ? true : false,
+    "aria-haspopup": isSearch ? 'listbox' : 'menu',
+    "aria-expanded": isPopupReady && isEditable ? true : false,
     tabIndex: tabIndex,
     "aria-labelledby": ariaLabelledby,
     "aria-label": ariaLabel,
@@ -307,10 +307,10 @@ function StatusDropdown(props) {
       inputRef: searchInputRef,
       onKeyDown: handleKeyDown,
       a11y: {
-        ariaHaspopup: true,
-        ariaExpanded: true,
+        ariaHaspopup: isSearch ? 'listbox' : 'menu',
+        ariaExpanded: isPopupReady,
         role: 'combobox',
-        ariaActivedescendant: value,
+        ariaActivedescendant: isPopupReady ? value : '',
         ariaOwns: ariaTitleId
       }
     })) : null, title && optionsList.length != 0 && /*#__PURE__*/React.createElement(Box, {
@@ -332,7 +332,7 @@ function StatusDropdown(props) {
       onScroll: handleScroll,
       role: isSearch ? 'listbox' : 'menu',
       "aria-labelledby": ariaTitleId,
-      tabindex: "0"
+      tabindex: "-1"
     }, optionsList.length != 0 && isDataLoaded ? /*#__PURE__*/React.createElement(React.Fragment, null, optionsList.map((item, i) => /*#__PURE__*/React.createElement(React.Fragment, {
       key: i
     }, /*#__PURE__*/React.createElement(StatusListItem, {

package/es/v1/lookup/Lookup/Lookup.js

@@ -45,7 +45,7 @@ export default function Lookup(props) {
     needRestoreFocus = true,
     needListNavigation = false,
     needFocusLoop = true,
-    needEnterAction = false
+    needEnterAction = true
   } = focusScopeProps;
   const createRef = useRef(null);
   const handleKeyDown = useCallback(e => {

package/es/version2/GlobalNotification/GlobalNotification.module.css

@@ -102,7 +102,7 @@
   font-size: var(--zd_font_size14) ;
   font-family: var(--zd_semibold);
   composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
-  line-height: 1.4286;
+  line-height: var(--zd_size20);
 }
 
 [dir=ltr] .text {

package/es/version2/errorstate/V2_ErrorStates.module.css

@@ -8,7 +8,7 @@
   font-family: var(--zd_bold);
 }
 .desc {
-  line-height: 1.5714;
+  line-height: var(--zd_size22);
 }
 .large .errorState {
   width: var(--zd_size450) ;

package/es/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css

@@ -56,7 +56,7 @@
 .title {
   color: var(--zdt_alertlookupnew_text);
   font-size: var(--zd_font_size18) ;
-  line-height: 1.2222;
+  line-height: var(--zd_size22);
   font-family: var(--zd_bold);
   composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
   vertical-align: middle;

package/es/version2/lookup/AlertLookup/AlertLookupNew.module.css

@@ -5,7 +5,7 @@
 .innerSection {
   color: var(--zdt_alertlookupnew_text);
   font-size: var(--zd_font_size14) ;
-  line-height: 1.428;
+  line-height: var(--zd_size20);
   composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
   padding: var(--zd_size17) var(--zd_size30) var(--zd_size30) ;
 }

package/es/version2/notification/DesktopNotification/DesktopNotification.module.css

@@ -108,7 +108,7 @@
 
 .subTitle {
   font-size: var(--zd_font_size15) ;
-  line-height: 1.3333;
+  line-height: var(--zd_size20);
   font-family: var(--zd_semibold);
   composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
 }
@@ -119,7 +119,7 @@
 
 .infoText {
   font-size: var(--zd_font_size14) ;
-  line-height: 1.2857;
+  line-height: var(--zd_size18);
   composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
 }
 

package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.js

@@ -65,7 +65,7 @@ export default class DesktopNotificationHeader extends Component {
         $ui_className: style.title,
         $ui_tagName: "h1",
         $ui_size: uptoTablet ? '16' : '18',
-        $ui_lineHeight: "1.2",
+        $ui_lineHeight: "20",
         $ui_weight: "bold",
         $flag_reset: true,
         $ui_wordBreak: "breakWord"

package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css

@@ -67,7 +67,7 @@
 }
 
 .primary .infoText {
-    line-height: 1;
+    line-height: var(--zd_size18);
   }
 
   .primary .close {
@@ -96,7 +96,7 @@
   }
 
   .secondary .infoText {
-    line-height: 1.4286;
+    line-height: var(--zd_size20);
   }
 
   .secondary .iconContainer {

package/lib/ActionButton/ActionButton.js

@@ -63,48 +63,57 @@ var ActionButton = /*#__PURE__*/function (_React$Component) {
 
     _this = _super.call(this, props);
     _this.handleTogglePopup = _this.handleTogglePopup.bind(_assertThisInitialized(_this));
+    _this.handlePopupOpen = _this.handlePopupOpen.bind(_assertThisInitialized(_this));
     return _this;
   }
 
   _createClass(ActionButton, [{
-    key: "handleTogglePopup",
-    value: function handleTogglePopup(e) {
+    key: "handlePopupOpen",
+    value: function handlePopupOpen(e) {
       var _this$props = this.props,
-          togglePopup = _this$props.togglePopup,
+          openPopupOnly = _this$props.openPopupOnly,
           defaultPosition = _this$props.defaultPosition;
+      openPopupOnly(e, defaultPosition);
+    }
+  }, {
+    key: "handleTogglePopup",
+    value: function handleTogglePopup(e) {
+      var _this$props2 = this.props,
+          togglePopup = _this$props2.togglePopup,
+          defaultPosition = _this$props2.defaultPosition;
       togglePopup(e, defaultPosition);
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$props2 = this.props,
-          isLoading = _this$props2.isLoading,
-          onClick = _this$props2.onClick,
-          size = _this$props2.size,
-          dataId = _this$props2.dataId,
-          dataSelectorId = _this$props2.dataSelectorId,
-          isArrow = _this$props2.isArrow,
-          text = _this$props2.text,
-          subText = _this$props2.subText,
-          arrowBoxSize = _this$props2.arrowBoxSize,
-          palette = _this$props2.palette,
-          onHover = _this$props2.onHover,
-          position = _this$props2.position,
-          className = _this$props2.className,
-          iconName = _this$props2.iconName,
-          iconSize = _this$props2.iconSize,
-          dataTitle = _this$props2.dataTitle,
-          isDisabled = _this$props2.isDisabled,
-          isPopupOpen = _this$props2.isPopupOpen,
-          removeClose = _this$props2.removeClose,
-          children = _this$props2.children,
-          dropBoxClass = _this$props2.dropBoxClass,
-          isBoxPaddingNeed = _this$props2.isBoxPaddingNeed,
-          getContainerRef = _this$props2.getContainerRef,
-          getTargetRef = _this$props2.getTargetRef,
-          removeChildrenTooltip = _this$props2.removeChildrenTooltip,
-          innerClassName = _this$props2.innerClassName,
-          popupGroup = _this$props2.popupGroup;
+      var _this$props3 = this.props,
+          isLoading = _this$props3.isLoading,
+          onClick = _this$props3.onClick,
+          size = _this$props3.size,
+          dataId = _this$props3.dataId,
+          dataSelectorId = _this$props3.dataSelectorId,
+          isArrow = _this$props3.isArrow,
+          text = _this$props3.text,
+          subText = _this$props3.subText,
+          arrowBoxSize = _this$props3.arrowBoxSize,
+          palette = _this$props3.palette,
+          onHover = _this$props3.onHover,
+          position = _this$props3.position,
+          className = _this$props3.className,
+          iconName = _this$props3.iconName,
+          iconSize = _this$props3.iconSize,
+          dataTitle = _this$props3.dataTitle,
+          isDisabled = _this$props3.isDisabled,
+          isPopupOpen = _this$props3.isPopupOpen,
+          removeClose = _this$props3.removeClose,
+          children = _this$props3.children,
+          dropBoxClass = _this$props3.dropBoxClass,
+          isBoxPaddingNeed = _this$props3.isBoxPaddingNeed,
+          getContainerRef = _this$props3.getContainerRef,
+          getTargetRef = _this$props3.getTargetRef,
+          removeChildrenTooltip = _this$props3.removeChildrenTooltip,
+          innerClassName = _this$props3.innerClassName,
+          popupGroup = _this$props3.popupGroup;
       return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         alignBox: "row",
         isCover: false,
@@ -152,7 +161,7 @@ var ActionButton = /*#__PURE__*/function (_React$Component) {
         "data-title": removeChildrenTooltip ? null : subText,
         className: _ActionButtonModule["default"].subTxt
       }, subText) : null)), children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-        onClick: onClick ? !onHover && this.handleTogglePopup : undefined,
+        onClick: onClick && !onHover ? this.handleTogglePopup : this.handlePopupOpen,
         onMouseEnter: onClick ? onHover && this.handleTogglePopup : undefined,
         onMouseLeave: onClick ? onHover && this.handleTogglePopup : undefined,
         className: "".concat(_semanticButtonModule["default"].buttonReset, " ").concat(_ActionButtonModule["default"][arrowBoxSize + '_arrowBox'], " ").concat(_ActionButtonModule["default"][palette + 'Arw'], "  ").concat(_ActionButtonModule["default"].arrowWrapper, " ").concat(isPopupOpen ? _ActionButtonModule["default"].arrowActive : ''),

package/lib/ActionButton/props/propTypes.js

@@ -38,6 +38,7 @@ var propTypes = {
   removeChildrenTooltip: _propTypes["default"].bool,
   innerClassName: _propTypes["default"].string,
   popupGroup: _propTypes["default"].string,
-  togglePopup: _propTypes["default"].func
+  togglePopup: _propTypes["default"].func,
+  openPopupOnly: _propTypes["default"].func
 };
 exports.propTypes = propTypes;

package/lib/Attachment/Attachment.module.css

@@ -82,12 +82,12 @@
 
 .medium .atatchName {
   font-size: var(--zd_font_size14) ;
-  line-height: 1.4286;
+  line-height: var(--zd_size20);
 }
 
 .small .atatchName {
   font-size: var(--zd_font_size12) ;
-  line-height: 1.25;
+  line-height: var(--zd_size15);
 }
 
 .attachSize {

package/lib/AttachmentViewer/AttachmentViewer.module.css

@@ -79,7 +79,7 @@
     font-size: var(--zd_font_size22) ;
     height: var(--zd_size38) ;
     width: var(--zd_size38) ;
-    line-height: 1.6364;
+    line-height: var(--zd_size36);
     border-radius: 50%;
     cursor: pointer;
 }