@zohodesk/components 1.0.0-temp-162 → 1.0.0-temp-163

package/lib/Avatar/Avatar.js

@@ -10,7 +10,6 @@ var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
 var _getInitial = require("../utils/getInitial");
 var _AvatarSize = _interopRequireDefault(require("../Provider/AvatarSize"));
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _AvatarModule = _interopRequireDefault(require("./Avatar.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -177,13 +176,10 @@ var Avatar = /*#__PURE__*/function (_React$Component) {
         "data-id": dataId,
         onClick: onClick,
         "data-selector-id": dataSelectorId
-      }, AvatarProps), showInitial && !showAlternateAvatar && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+      }, AvatarProps), showInitial && !showAlternateAvatar && /*#__PURE__*/_react["default"].createElement("span", {
         className: "".concat(_AvatarModule["default"].initial),
-        dataId: "".concat(dataId, "_AvatarInitial"),
-        customProps: {
-          'data-selector-id': "".concat(dataSelectorId, "_AvatarInitial")
-        },
-        tagName: "span"
+        "data-id": "".concat(dataId, "_AvatarInitial"),
+        "data-selector-id": "".concat(dataSelectorId, "_AvatarInitial")
       }, initial), (showAvatar || showAlternateAvatar) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("img", {
         className: "".concat(_AvatarModule["default"].image, " ").concat(isAnimate ? _AvatarModule["default"].animate : '', " ").concat(needInnerBorder ? _AvatarModule["default"].innerBorder : ''),
         "data-id": "".concat(dataId, "_AvatarImg"),

package/lib/DateTime/CalendarView.js

@@ -9,7 +9,6 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("./props/propTypes");
 var _defaultProps = require("./props/defaultProps");
 var _Layout = require("../Layout");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _DateTimeModule = _interopRequireDefault(require("./DateTime.module.css"));
 var _common = require("../utils/datetime/common");
 var _DaysRow = _interopRequireDefault(require("./DaysRow"));
@@ -235,9 +234,7 @@ var Span = /*#__PURE__*/function (_React$PureComponent2) {
         key: i,
         onClick: this.handleSelectChild,
         "aria-label": incremday
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        size: "13"
-      }, incremday));
+      }, incremday);
     }
   }]);
   return Span;

package/lib/DateTime/DateTime.module.css

@@ -44,15 +44,13 @@
 
 .thArrow,
 .datesStr {
+  font-size: 13px;
   color: var(--zdt_datetime_datestr_text);
 }
 
 .thArrow, .datesStr {
   cursor: pointer;
 }
-.thArrow{
-   font-size: var(--zd_font_size13);
-}
 
 .thArrow:hover,
 .datesStr:hover {
@@ -96,6 +94,7 @@
 }
 
 .daysStr {
+  font-size: 10px;
   color: var(--zdt_datetime_daystr_text);
   text-transform: uppercase;
   composes: semibold;
@@ -202,6 +201,7 @@
 
 .text {
   composes: boxPadding;
+  font-size: 11px;
   text-transform: uppercase;
   color: var(--zdt_datetime_text);
   composes: semibold;
@@ -233,4 +233,4 @@
   border-radius: 3px;
   box-shadow: var(--zd_bs_dropbox_bottom);
   background-color: var(--zdt_dropbox_default_bg);
-}
+}

package/lib/DateTime/DateTimePopupHeader.js

@@ -8,7 +8,7 @@ exports["default"] = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _Layout = require("../Layout");
 var _icons = require("@zohodesk/icons");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
+var _Heading = _interopRequireDefault(require("../Heading/Heading"));
 var _DateTimeModule = _interopRequireDefault(require("./DateTime.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -90,11 +90,14 @@ var DateTimePopupHeader = /*#__PURE__*/function (_PureComponent) {
         className: _DateTimeModule["default"].dateText,
         dataId: "selectYear",
         onClick: onOpenYearView
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+      }, /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
         className: _DateTimeModule["default"].thMonYear,
+        title: showMonthTxt,
         tagName: "h2",
-        size: "13"
-      }, showMonthTxt), /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+        a11y: {
+          tabindex: '0'
+        }
+      }), /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
         name: "ZD-GN-dropdown",
         size: "12",
         iconClass: _DateTimeModule["default"].downArrow

package/lib/DateTime/DaysRow.js

@@ -8,7 +8,6 @@ exports["default"] = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _DateTimeModule = _interopRequireDefault(require("./DateTime.module.css"));
 var _Layout = require("../Layout");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -44,12 +43,10 @@ var DaysRow = /*#__PURE__*/function (_PureComponent) {
       }, dayNames.map(function (dayName, index) {
         return /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
           key: dayName,
+          className: "".concat(_DateTimeModule["default"].daysStr, " ").concat(_DateTimeModule["default"].grid, " ").concat(index === 0 ? _DateTimeModule["default"].sunday : ''),
           "data-title": dayName,
           "aria-label": dayName
-        }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-          className: "".concat(_DateTimeModule["default"].daysStr, " ").concat(_DateTimeModule["default"].grid, " ").concat(index === 0 ? _DateTimeModule["default"].sunday : ''),
-          size: "10"
-        }, " ", dayNamesShort[index]));
+        }, dayNamesShort[index]);
       }));
     }
   }]);

package/lib/DateTime/Time.js

@@ -8,7 +8,6 @@ exports["default"] = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _Layout = require("../Layout");
 var _Select = _interopRequireDefault(require("../Select/Select"));
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _DateTimeModule = _interopRequireDefault(require("./DateTime.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -51,10 +50,8 @@ var Time = /*#__PURE__*/function (_PureComponent) {
         onAmPmSelect = _this$props.onAmPmSelect,
         amPm = _this$props.amPm,
         is24Hour = _this$props.is24Hour;
-      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: _DateTimeModule["default"].text,
-        tagName: "span",
-        size: "11"
+      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("span", {
+        className: _DateTimeModule["default"].text
       }, timeText), /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         alignBox: "row",
         align: "vertical",

package/lib/DateTime/YearView.js

@@ -11,7 +11,7 @@ var _defaultProps = require("./props/defaultProps");
 var _virtualizer = require("@zohodesk/virtualizer");
 var _Layout = require("../Layout");
 var _icons = require("@zohodesk/icons");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
+var _Heading = _interopRequireDefault(require("../Heading/Heading"));
 var _YearViewModule = _interopRequireDefault(require("./YearView.module.css"));
 var _dateFormatUtils = require("./dateFormatUtils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -72,12 +72,14 @@ var Year = /*#__PURE__*/function (_React$PureComponent) {
         align: "vertical"
       }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+      }, /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
         className: _YearViewModule["default"].yearText,
-        tagName: "h2",
-        size: "11",
-        dataTitle: year
-      }, year)), /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
+        title: year,
+        a11y: {
+          tabindex: '0'
+        },
+        tagName: "h4"
+      })), /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
         name: "ZD-arrowDownSingle",
         size: "7",
         isBold: true,
@@ -121,9 +123,7 @@ var Month = /*#__PURE__*/function (_React$PureComponent2) {
         onClick: this.handleClick,
         "data-title": hoverText,
         "aria-label": month
-      }, /*#__PURE__*/_react["default"].createElement(Typo, {
-        size: "12"
-      }, displayText));
+      }, displayText);
     }
   }]);
   return Month;

package/lib/DateTime/YearView.module.css

@@ -8,6 +8,7 @@
 
 .month {
   width: 30.333%;
+  font-size: 12px;
   line-height: var(--zd_size26);
   height: 26px;
   color: var(--zdt_yearview_month_text);
@@ -47,6 +48,7 @@
 
 .yearText {
   color: var(--zdt_yearview_yeartext_text);
+  font-size: 11px;
 }
 
 .arrow {
@@ -61,6 +63,7 @@
 .isActive .yearText {
   font-family: var(--zd_semibold);
   color: var(--zdt_yearview_year_hover_text);
+  font-size: 11px;
 }
 
 .arrowActive {
@@ -93,4 +96,4 @@
 .toggleYear {
   height: 0;
   padding: 0;
-}
+}

package/lib/Heading/Heading.js

@@ -38,18 +38,19 @@ var Heading = /*#__PURE__*/function (_React$Component) {
       var _this$props = this.props,
         tagName = _this$props.tagName,
         className = _this$props.className,
+        onClick = _this$props.onClick,
+        onDoubleClick = _this$props.onDoubleClick,
         title = _this$props.title,
         dataTitle = _this$props.dataTitle,
         dataId = _this$props.dataId,
-        a11y = _this$props.a11y,
-        customProps = _this$props.customProps,
-        size = _this$props.size,
-        children = _this$props.children;
-      return /*#__PURE__*/_react["default"].createElement(tagName, _objectSpread(_objectSpread({
-        className: "".concat(_HeadingModule["default"].reset, " ").concat(_HeadingModule["default"]["size".concat(size)], "  ").concat(className),
+        a11y = _this$props.a11y;
+      return /*#__PURE__*/_react["default"].createElement(tagName, _objectSpread({
+        className: "".concat(_HeadingModule["default"].reset, " ").concat(className),
+        onClick: onClick,
+        onDoubleClick: onDoubleClick,
         'data-title': dataTitle || title,
         'data-id': dataId
-      }, customProps), a11y), title, children);
+      }, a11y), title);
     }
   }]);
   return Heading;

package/lib/Heading/Heading.module.css

@@ -2,71 +2,4 @@
   font-size: initial;
   font-weight: initial;
   margin: initial;
-}
-
-.size8{
-  font-size: 8px;
-}
-.size9{
-  font-size: 9px;
-}
-.size10{
-  font-size: 10px;
-}
-.size11{
-  font-size: 11px;
-}
-.size12{
-  font-size: 12px;
-}
-.size13{
-  font-size: 13px;
-}
-.size14{
-  font-size: 14px;
-}
-.size15{
-  font-size: 15px;
-}
-.size16{
-  font-size: 16px;
-}
-.size17{
-  font-size: 17px;
-}
-.size18{
-  font-size: 18px;
-}
-.size19{
-  font-size: 19px;
-}
-.size20{
-  font-size: 20px;
-}
-.size21{
-  font-size: 21px;
-}
-.size22{
-  font-size: 22px;
-}
-.size23{
-  font-size: 23px;
-}
-.size24{
-  font-size: 24px;
-}
-.size25{
-  font-size: 25px;
-}
-.size26{
-  font-size: 26px;
-}
-.size30{
-  font-size: 30px;
-}
-.size50{
-  font-size: 50px;
-}
-.sizeinherit{
-  font-size: inherit;
-}
+}

package/lib/Heading/props/defaultProps.js

@@ -7,8 +7,6 @@ exports.defaultProps = void 0;
 var defaultProps = {
   tagName: 'h1',
   a11y: {},
-  className: '',
-  customProps: {},
-  size: 'inherit'
+  className: ''
 };
 exports.defaultProps = defaultProps;

package/lib/Heading/props/propTypes.js

@@ -12,9 +12,8 @@ var propTypes = {
   title: _propTypes["default"].string,
   dataId: _propTypes["default"].string,
   dataTitle: _propTypes["default"].string,
-  customProps: _propTypes["default"].object,
-  children: _propTypes["default"].node,
-  a11y: _propTypes["default"].object,
-  size: _propTypes["default"].oneOf(['8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '30', '50', 'inherit'])
+  onClick: _propTypes["default"].func,
+  onDoubleClick: _propTypes["default"].func,
+  a11y: _propTypes["default"].object
 };
 exports.propTypes = propTypes;

package/lib/Label/Label.js

@@ -8,7 +8,6 @@ exports["default"] = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _LabelModule = _interopRequireDefault(require("./Label.module.css"));
 var _LabelColorsModule = _interopRequireDefault(require("./LabelColors.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -49,16 +48,14 @@ var Label = /*#__PURE__*/function (_React$Component) {
         customClass = _this$props.customClass,
         id = _this$props.id;
       return /*#__PURE__*/_react["default"].createElement("label", {
-        className: "".concat(_LabelModule["default"].label, " ").concat(_LabelModule["default"][type], " ").concat(_LabelColorsModule["default"][palette], " ").concat(_LabelModule["default"]["font_".concat(variant)], "\n           ").concat(onClick ? _LabelModule["default"].pointer : _LabelModule["default"].cursor, " ").concat(customClass, " "),
+        className: "".concat(_LabelModule["default"].label, " ").concat(_LabelModule["default"][type], " ").concat(_LabelModule["default"][size], " ").concat(_LabelColorsModule["default"][palette], " ").concat(_LabelModule["default"]["font_".concat(variant)], "\n          ").concat(clipped ? _LabelModule["default"].dotted : '', " ").concat(onClick ? _LabelModule["default"].pointer : _LabelModule["default"].cursor, " ").concat(customClass, " "),
         htmlFor: htmlFor,
         "data-title": title,
         "data-id": dataId,
         "data-selector-id": dataSelectorId,
         onClick: onClick,
         id: id
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: "".concat(clipped ? _LabelModule["default"].dotted : '', " ").concat(_LabelModule["default"][size])
-      }, text));
+      }, text);
     }
   }]);
   return Label;

package/lib/ListItem/ListItem.js

@@ -10,7 +10,6 @@ var _Layout = require("../Layout");
 var _ListContainer = _interopRequireDefault(require("./ListContainer"));
 var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _icons = require("@zohodesk/icons");
 var _ListItemModule = _interopRequireDefault(require("./ListItem.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -130,12 +129,9 @@ var ListItem = /*#__PURE__*/function (_React$Component) {
         customProps: ListItemProps
       }, ContainerProps), value ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         shrink: true,
-        adjust: true
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
-        size: "13",
-        dataTitle: value
-      }, value)) : null, children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+        adjust: true,
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
+      }, value) : null, children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         shrink: true,
         adjust: true,
         className: _ListItemModule["default"].children

package/lib/ListItem/ListItem.module.css

@@ -25,6 +25,7 @@
   position: relative;
   list-style: none;
   color: var(--listitem_text_color);
+  font-size: 13px;
   height: var(--listitem_height);
   min-height: var(--listitem_min_height);
   text-decoration: none;

package/lib/ListItem/ListItemWithAvatar.js

@@ -13,7 +13,6 @@ var _propTypes = require("./props/propTypes");
 var _Avatar = _interopRequireDefault(require("../Avatar/Avatar"));
 var _AvatarTeam = _interopRequireDefault(require("../AvatarTeam/AvatarTeam"));
 var _icons = require("@zohodesk/icons");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _ListItemModule = _interopRequireDefault(require("./ListItem.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -156,12 +155,9 @@ var ListItemWithAvatar = /*#__PURE__*/function (_React$PureComponent) {
       })) : null, value ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
-        "data-title": isDisabled ? null : title
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
-        size: "13",
-        dataTitle: value
-      }, value)) : null, needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+        "data-title": isDisabled ? null : title,
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
+      }, value) : null, needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         className: _ListItemModule["default"].tickIcon,
         "aria-hidden": ariaHidden,
         dataId: "".concat(dataIdString, "_tickIcon"),

package/lib/ListItem/ListItemWithCheckBox.js

@@ -11,7 +11,6 @@ var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
 var _CheckBox = _interopRequireDefault(require("../CheckBox/CheckBox"));
 var _Layout = require("../Layout");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _ListItemModule = _interopRequireDefault(require("./ListItem.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -129,12 +128,9 @@ var ListItemWithCheckBox = /*#__PURE__*/function (_React$Component) {
       })), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
-        "data-title": isDisabled ? null : title
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
-        size: "13",
-        dataTitle: value
-      }, value)));
+        "data-title": isDisabled ? null : title,
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
+      }, value));
     }
   }]);
   return ListItemWithCheckBox;

package/lib/ListItem/ListItemWithIcon.js

@@ -11,7 +11,6 @@ var _icons = require("@zohodesk/icons");
 var _ListContainer = _interopRequireDefault(require("./ListContainer"));
 var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _ListItemModule = _interopRequireDefault(require("./ListItem.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -138,13 +137,10 @@ var ListItemWithIcon = /*#__PURE__*/function (_React$Component) {
       }) : null, value && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
         "data-title": isDisabled ? null : title,
         dataId: "".concat(dataIdString, "_Text")
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
-        size: "13",
-        dataTitle: value
-      }, value)), needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+      }, value), needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         className: _ListItemModule["default"].tickIcon,
         "aria-hidden": ariaHidden,
         dataId: "".concat(dataIdString, "_tickIcon"),

package/lib/ListItem/ListItemWithRadio.js

@@ -11,7 +11,6 @@ var _Layout = require("../Layout");
 var _ListContainer = _interopRequireDefault(require("./ListContainer"));
 var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _ListItemModule = _interopRequireDefault(require("./ListItem.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -131,12 +130,9 @@ var ListItemWithRadio = /*#__PURE__*/function (_React$Component) {
       })), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
-        "data-title": disableTitle ? null : title
-      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
-        size: "13",
-        dataTitle: value
-      }, value)));
+        "data-title": disableTitle ? null : title,
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
+      }, value));
     }
   }]);
   return ListItemWithRadio;

package/lib/Responsive/ResizeComponent.js

@@ -34,9 +34,21 @@ var ResizeComponent = /*#__PURE__*/function (_React$Component) {
     _this = _super.call(this, props);
     _this.noSpaceForChildren = false;
     _this.childrenCurrentList = [];
-    _this.widthCheck = (0, _Common.debounce)(_this.widthCheck.bind(_assertThisInitialized(_this)), 10);
-    // this.widthCheck = this.widthCheck.bind(this);
-    _this.onResize = _this.onResize.bind(_assertThisInitialized(_this));
+    var debounce = function debounce(cb) {
+      var timer = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 500;
+      var timeoutId = null;
+      return function () {
+        if (timeoutId) {
+          clearTimeout(timeoutId);
+        }
+        timeoutId = setTimeout(function () {
+          cb();
+        }, timer);
+      };
+    };
+    _this.widthCheck = debounce(_this.widthCheck.bind(_assertThisInitialized(_this)), 500); // this.widthCheck = this.widthCheck.bind(this);
+
+    _this.onResize = debounce(_this.onResize.bind(_assertThisInitialized(_this)), 500);
     _this.onResizeMutation = _this.onResizeMutation.bind(_assertThisInitialized(_this));
     _this.tabsObserver = new _ResizeObserver["default"](_this.onResize);
     _this.tabObserver = new MutationObserver(_this.onResizeMutation);

package/lib/Tab/Tab.js

@@ -9,7 +9,6 @@ var _react = _interopRequireWildcard(require("react"));
 var _defaultProps = require("./props/defaultProps");
 var _propTypes = require("./props/propTypes");
 var _Layout = require("../Layout");
-var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _Common = require("../utils/Common");
 var _TabModule = _interopRequireDefault(require("./Tab.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -103,10 +102,9 @@ function Tab(_ref) {
     className: _TabModule["default"].textContainer
   }, text && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     flexible: true,
-    adjust: true
-  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    adjust: true,
     className: _TabModule["default"].tabText
-  }, text)), children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+  }, text), children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     shrink: true
   }, children) : null));
 }