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

package/lib/Heading/props/propTypes.js

@@ -12,8 +12,9 @@ var propTypes = {
   title: _propTypes["default"].string,
   dataId: _propTypes["default"].string,
   dataTitle: _propTypes["default"].string,
-  onClick: _propTypes["default"].func,
-  onDoubleClick: _propTypes["default"].func,
-  a11y: _propTypes["default"].object
+  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'])
 };
 exports.propTypes = propTypes;

package/lib/Label/Label.js

@@ -8,6 +8,7 @@ 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 }; }
@@ -48,14 +49,16 @@ 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(_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, " "),
+        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, " "),
         htmlFor: htmlFor,
         "data-title": title,
         "data-id": dataId,
         "data-selector-id": dataSelectorId,
         onClick: onClick,
         id: id
-      }, text);
+      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+        className: "".concat(clipped ? _LabelModule["default"].dotted : '', " ").concat(_LabelModule["default"][size])
+      }, text));
     }
   }]);
   return Label;

package/lib/ListItem/ListItem.js

@@ -10,6 +10,7 @@ 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 }; }
@@ -129,9 +130,12 @@ var ListItem = /*#__PURE__*/function (_React$Component) {
         customProps: ListItemProps
       }, ContainerProps), value ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         shrink: true,
-        adjust: true,
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
-      }, value) : null, children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+        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, {
         shrink: true,
         adjust: true,
         className: _ListItemModule["default"].children

package/lib/ListItem/ListItem.module.css

@@ -25,7 +25,6 @@
   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,6 +13,7 @@ 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); }
@@ -155,9 +156,12 @@ var ListItemWithAvatar = /*#__PURE__*/function (_React$PureComponent) {
       })) : null, value ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
-        "data-title": isDisabled ? null : title,
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
-      }, value) : null, needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+        "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, {
         className: _ListItemModule["default"].tickIcon,
         "aria-hidden": ariaHidden,
         dataId: "".concat(dataIdString, "_tickIcon"),

package/lib/ListItem/ListItemWithCheckBox.js

@@ -11,6 +11,7 @@ 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); }
@@ -128,9 +129,12 @@ var ListItemWithCheckBox = /*#__PURE__*/function (_React$Component) {
       })), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
-        "data-title": isDisabled ? null : title,
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
-      }, value));
+        "data-title": isDisabled ? null : title
+      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
+        size: "13",
+        dataTitle: value
+      }, value)));
     }
   }]);
   return ListItemWithCheckBox;

package/lib/ListItem/ListItemWithIcon.js

@@ -11,6 +11,7 @@ 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); }
@@ -137,10 +138,13 @@ 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")
-      }, value), needTick && active ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+      }, /*#__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, {
         className: _ListItemModule["default"].tickIcon,
         "aria-hidden": ariaHidden,
         dataId: "".concat(dataIdString, "_tickIcon"),

package/lib/ListItem/ListItemWithRadio.js

@@ -11,6 +11,7 @@ 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); }
@@ -130,9 +131,12 @@ var ListItemWithRadio = /*#__PURE__*/function (_React$Component) {
       })), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         flexible: true,
         shrink: true,
-        "data-title": disableTitle ? null : title,
-        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value
-      }, value));
+        "data-title": disableTitle ? null : title
+      }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+        className: needMultiLineText ? _ListItemModule["default"].multiLineValue : _ListItemModule["default"].value,
+        size: "13",
+        dataTitle: value
+      }, value)));
     }
   }]);
   return ListItemWithRadio;

package/lib/Tab/Tab.js

@@ -9,6 +9,7 @@ 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 }; }
@@ -102,9 +103,10 @@ function Tab(_ref) {
     className: _TabModule["default"].textContainer
   }, text && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     flexible: true,
-    adjust: true,
+    adjust: true
+  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
     className: _TabModule["default"].tabText
-  }, text), children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+  }, text)), children ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     shrink: true
   }, children) : null));
 }

package/lib/Tab/Tabs.module.css

@@ -122,6 +122,12 @@
 }
 
 
+.bottomRightToLeft,
+.topRightToLeft,
+.bottomCenterToLeft {
+}
+
+
 [dir=ltr] .bottomRightToLeft, [dir=ltr] .topRightToLeft, [dir=ltr] .bottomCenterToLeft {
   right: calc(var(--tab_position_gap) * -1);
 }
@@ -131,6 +137,11 @@
   left: calc(var(--tab_position_gap) * -1);
 }
 
+.bottomLeftToRight,
+.topLeftToRight,
+.bottomCenterToRight {
+}
+
 [dir=ltr] .bottomLeftToRight, [dir=ltr] .topLeftToRight, [dir=ltr] .bottomCenterToRight {
   left: calc(var(--tab_position_gap) * -1);
 }

package/lib/Tag/Tag.js

@@ -12,6 +12,7 @@ var _icons = require("@zohodesk/icons");
 var _Avatar = _interopRequireDefault(require("../Avatar/Avatar"));
 var _Layout = require("../Layout");
 var _Button = _interopRequireDefault(require("../semantic/Button/Button"));
+var _Typography = _interopRequireDefault(require("../Typography/Typography"));
 var _IdProvider = require("../Provider/IdProvider");
 var _TagModule = _interopRequireDefault(require("./Tag.module.css"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -147,10 +148,14 @@ var Tag = /*#__PURE__*/function (_PureComponent) {
       }, /*#__PURE__*/_react["default"].createElement(_icons.Icon, {
         name: iconName,
         size: iconSize
-      })) : null, /*#__PURE__*/_react["default"].createElement("div", {
+      })) : null, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
         className: "".concat(_TagModule["default"].text, " ").concat(textSizes),
-        "aria-hidden": true,
-        id: getAriaId
+        a11y: {
+          'aria-hidden': true
+        },
+        customProps: {
+          id: getAriaId
+        }
       }, text), onRemove && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
         customClass: "".concat(_TagModule["default"].close, " ").concat(active ? _TagModule["default"]["active".concat(closePalette, "Close")] : '', "\n            ").concat(rounded ? _TagModule["default"].lgRadiusClose : _TagModule["default"].smRadiusClose, " ").concat(isDarkPalette ? _TagModule["default"].darkTagClose : '', "\n            ").concat(customTagClose, " ").concat(_TagModule["default"]["close".concat(closePalette)]),
         dataId: "".concat(dataId, "_RemoveTag"),

package/lib/Text/Text.js

@@ -0,0 +1,58 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _defaultProps = require("./props/defaultProps");
+var _propTypes = require("./props/propTypes");
+var _TextModule = _interopRequireDefault(require("./Text.module.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+var Text = /*#__PURE__*/function (_React$Component) {
+  _inherits(Text, _React$Component);
+  var _super = _createSuper(Text);
+  function Text() {
+    _classCallCheck(this, Text);
+    return _super.apply(this, arguments);
+  }
+  _createClass(Text, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        tagName = _this$props.tagName,
+        className = _this$props.className,
+        dataTitle = _this$props.dataTitle,
+        dataId = _this$props.dataId,
+        a11y = _this$props.a11y,
+        children = _this$props.children,
+        customProps = _this$props.customProps,
+        size = _this$props.size;
+      return /*#__PURE__*/_react["default"].createElement(tagName, _objectSpread(_objectSpread({
+        className: "".concat(_TextModule["default"]["size".concat(size)], " ").concat(className),
+        'data-title': dataTitle,
+        'data-id': dataId
+      }, customProps), a11y), children);
+    }
+  }]);
+  return Text;
+}(_react["default"].Component);
+exports["default"] = Text;
+Text.propTypes = _propTypes.propTypes;
+Text.defaultProps = _defaultProps.defaultProps;

package/lib/Text/Text.module.css

@@ -0,0 +1,72 @@
+.reset {
+  font-weight: initial;
+  margin: initial;
+  padding: 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/Text/props/defaultProps.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultProps = void 0;
+var defaultProps = {
+  tagName: 'div',
+  a11y: {},
+  className: '',
+  customProps: {},
+  size: 'inherit'
+};
+exports.defaultProps = defaultProps;

package/lib/Text/props/propTypes.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.propTypes = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var propTypes = {
+  tagName: _propTypes["default"].string,
+  className: _propTypes["default"].string,
+  dataId: _propTypes["default"].string,
+  dataTitle: _propTypes["default"].string,
+  title: _propTypes["default"].string,
+  a11y: _propTypes["default"].object,
+  children: _propTypes["default"].node,
+  customProps: _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'])
+};
+exports.propTypes = propTypes;

package/lib/Typography/Typography.js

@@ -0,0 +1,59 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _defaultProps = require("./props/defaultProps");
+var _propTypes = require("./props/propTypes");
+var _TypographyModule = _interopRequireDefault(require("./Typography.module.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+var Typography = /*#__PURE__*/function (_React$Component) {
+  _inherits(Typography, _React$Component);
+  var _super = _createSuper(Typography);
+  function Typography() {
+    _classCallCheck(this, Typography);
+    return _super.apply(this, arguments);
+  }
+  _createClass(Typography, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        tagName = _this$props.tagName,
+        className = _this$props.className,
+        dataTitle = _this$props.dataTitle,
+        dataId = _this$props.dataId,
+        a11y = _this$props.a11y,
+        children = _this$props.children,
+        customProps = _this$props.customProps,
+        size = _this$props.size,
+        needReset = _this$props.needReset;
+      return /*#__PURE__*/_react["default"].createElement(tagName, _objectSpread(_objectSpread({
+        className: "".concat(needReset ? _TypographyModule["default"].reset : '', " ").concat(_TypographyModule["default"]["size".concat(size)], " ").concat(className),
+        'data-title': dataTitle,
+        'data-id': dataId
+      }, customProps), a11y), children);
+    }
+  }]);
+  return Typography;
+}(_react["default"].Component);
+exports["default"] = Typography;
+Typography.propTypes = _propTypes.propTypes;
+Typography.defaultProps = _defaultProps.defaultProps;

package/lib/Typography/Typography.module.css

@@ -0,0 +1,72 @@
+.reset {
+  font-weight: initial;
+  margin: initial;
+  padding: 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/Typography/props/defaultProps.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultProps = void 0;
+var defaultProps = {
+  tagName: 'div',
+  a11y: {},
+  className: '',
+  customProps: {},
+  size: 'inherit',
+  needReset: true
+};
+exports.defaultProps = defaultProps;

package/lib/Typography/props/propTypes.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.propTypes = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var propTypes = {
+  tagName: _propTypes["default"].string,
+  className: _propTypes["default"].string,
+  dataId: _propTypes["default"].string,
+  dataTitle: _propTypes["default"].string,
+  a11y: _propTypes["default"].object,
+  children: _propTypes["default"].node,
+  customProps: _propTypes["default"].object,
+  needReset: _propTypes["default"].bool,
+  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'])
+};
+exports.propTypes = propTypes;

package/lib/index.js

@@ -30,7 +30,9 @@ var _exportNames = {
   TextBox: true,
   TextBoxIcon: true,
   Tooltip: true,
-  utils: true
+  utils: true,
+  Text: true,
+  Typography: true
 };
 Object.defineProperty(exports, "Animation", {
   enumerable: true,
@@ -148,6 +150,12 @@ Object.defineProperty(exports, "Tag", {
     return _Tag["default"];
   }
 });
+Object.defineProperty(exports, "Text", {
+  enumerable: true,
+  get: function get() {
+    return _Text["default"];
+  }
+});
 Object.defineProperty(exports, "TextBox", {
   enumerable: true,
   get: function get() {
@@ -172,6 +180,12 @@ Object.defineProperty(exports, "Tooltip", {
     return _Tooltip["default"];
   }
 });
+Object.defineProperty(exports, "Typography", {
+  enumerable: true,
+  get: function get() {
+    return _Typography["default"];
+  }
+});
 exports.utils = void 0;
 var _Accordion = require("./Accordion");
 Object.keys(_Accordion).forEach(function (key) {
@@ -346,6 +360,8 @@ Object.keys(_semantic).forEach(function (key) {
     }
   });
 });
+var _Text = _interopRequireDefault(require("./Text/Text"));
+var _Typography = _interopRequireDefault(require("./Typography/Typography"));
 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; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }