@laerdal/life-react-components 1.4.1-dev.11 → 1.4.1-dev.12

package/dist/cjs/styles/typography.js

@@ -1,640 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _typeof = require("@babel/runtime/helpers/typeof");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TYPOGRAPHY = exports.ParagraphXlStyling = exports.ParagraphXSStyling = exports.ParagraphXS = exports.ParagraphXL = exports.ParagraphTextStyle = exports.ParagraphSStyling = exports.ParagraphS = exports.ParagraphMStyling = exports.ParagraphM = exports.ParagraphLStyling = exports.ParagraphL = exports.HeadlineXXSStyling = exports.HeadlineXXS = exports.HeadlineXSStyling = exports.HeadlineXS = exports.HeadlineXLStyling = exports.HeadlineXL = exports.HeadlineSStyling = exports.HeadlineS = exports.HeadlineMStyling = exports.HeadlineM = exports.HeadlineLStyling = exports.HeadlineL = exports.ComponentXXSStyling = exports.ComponentXXS = exports.ComponentXSStyling = exports.ComponentXS = exports.ComponentXLStyling = exports.ComponentXL = exports.ComponentTextStyle = exports.ComponentSStyling = exports.ComponentS = exports.ComponentResponsive = exports.ComponentMStyling = exports.ComponentM = exports.ComponentLStyling = exports.ComponentL = void 0;
-
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-
-var _ = require(".");
-
-var _types = require("../types");
-
-var _jsxRuntime = require("react/jsx-runtime");
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
-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; }
-
-var TYPOGRAPHY = {
-  fontFamily: 'Lato, sans-serif'
-};
-exports.TYPOGRAPHY = TYPOGRAPHY;
-var TypographyBase = (0, _styledComponents.default)('div')(function (_ref) {
-  var $color = _ref.$color,
-      lineHeight = _ref.lineHeight,
-      $fontSize = _ref.$fontSize,
-      $fontWeight = _ref.$fontWeight,
-      $fontStyle = _ref.$fontStyle,
-      textTransform = _ref.textTransform,
-      textDecorationLine = _ref.textDecorationLine;
-  return {
-    fontFamily: TYPOGRAPHY.fontFamily,
-    fontSize: $fontSize,
-    fontWeight: $fontWeight,
-    lineHeight: lineHeight + 'px',
-    textTransform: textTransform ? textTransform : 'none',
-    textDecorationLine: textDecorationLine ? textDecorationLine : 'none',
-    fontStyle: $fontStyle ? $fontStyle : 'normal',
-    color: $color ? $color : _.COLORS.black
-  };
-});
-
-var HeadlineBaseStyling = function HeadlineBaseStyling(fontSize, lineHeight, color) {
-  return (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    font-family: ", ";\n    font-size: ", ";\n    line-height: ", ";\n    font-weight: 700;\n    color: ", ";\n  "])), TYPOGRAPHY.fontFamily, fontSize, lineHeight, color);
-};
-
-var HeadlineBase = (0, _styledComponents.default)(TypographyBase)(function (_ref2) {
-  var $color = _ref2.$color,
-      lineHeight = _ref2.lineHeight,
-      fontSize = _ref2.fontSize;
-  return {
-    fontSize: fontSize,
-    fontWeight: 700,
-    lineHeight: lineHeight,
-    color: $color
-  };
-});
-
-var HeadlineXLStyling = function HeadlineXLStyling(color) {
-  return HeadlineBaseStyling('48px', '64px', color);
-};
-
-exports.HeadlineXLStyling = HeadlineXLStyling;
-var HeadlineXL = (0, _styledComponents.default)(HeadlineBase)(function (_ref3) {
-  var $color = _ref3.$color;
-  return {
-    fontSize: '48px',
-    lineHeight: '64px',
-    color: $color
-  };
-});
-exports.HeadlineXL = HeadlineXL;
-
-var HeadlineLStyling = function HeadlineLStyling(color) {
-  return HeadlineBaseStyling('40px', '52px', color);
-};
-
-exports.HeadlineLStyling = HeadlineLStyling;
-var HeadlineL = (0, _styledComponents.default)(HeadlineBase)(function (_ref4) {
-  var $color = _ref4.$color;
-  return {
-    fontSize: '40px',
-    lineHeight: '52px',
-    color: $color
-  };
-});
-exports.HeadlineL = HeadlineL;
-
-var HeadlineMStyling = function HeadlineMStyling(color) {
-  return HeadlineBaseStyling('32px', '40px', color);
-};
-
-exports.HeadlineMStyling = HeadlineMStyling;
-var HeadlineM = (0, _styledComponents.default)(HeadlineBase)(function (_ref5) {
-  var $color = _ref5.$color;
-  return {
-    fontSize: '32px',
-    lineHeight: '40px',
-    color: $color
-  };
-});
-exports.HeadlineM = HeadlineM;
-
-var HeadlineSStyling = function HeadlineSStyling(color) {
-  return HeadlineBaseStyling('28px', '36px', color);
-};
-
-exports.HeadlineSStyling = HeadlineSStyling;
-var HeadlineS = (0, _styledComponents.default)(HeadlineBase)(function (_ref6) {
-  var $color = _ref6.$color;
-  return {
-    fontSize: '28px',
-    lineHeight: '36px',
-    color: $color
-  };
-});
-exports.HeadlineS = HeadlineS;
-
-var HeadlineXSStyling = function HeadlineXSStyling(color) {
-  return HeadlineBaseStyling('24px', '32px', color);
-};
-
-exports.HeadlineXSStyling = HeadlineXSStyling;
-var HeadlineXS = (0, _styledComponents.default)(HeadlineBase)(function (_ref7) {
-  var $color = _ref7.$color;
-  return {
-    fontSize: '24px',
-    lineHeight: '32px',
-    color: $color
-  };
-});
-exports.HeadlineXS = HeadlineXS;
-
-var HeadlineXXSStyling = function HeadlineXXSStyling(color) {
-  return HeadlineBaseStyling('20px', '24px', color);
-};
-
-exports.HeadlineXXSStyling = HeadlineXXSStyling;
-var HeadlineXXS = (0, _styledComponents.default)(HeadlineBase)(function (_ref8) {
-  var $color = _ref8.$color;
-  return {
-    fontSize: '20px',
-    lineHeight: '24px',
-    color: $color
-  };
-});
-exports.HeadlineXXS = HeadlineXXS;
-var ParagraphStyling = (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  :lang(ja-jp) > h1,\n  h2,\n  h3,\n  h4,\n  p,\n  span {\n    max-width: 30em;\n  }\n  :lang(ko-kr) > h1,\n  h2,\n  h3,\n  h4,\n  p,\n  span {\n    max-width: 30em;\n  }\n  :lang(zh-CN) > h1,\n  h2,\n  h3,\n  h4,\n  p,\n  span {\n    max-width: 30em;\n  }\n  h1,\n  h2,\n  h3,\n  h4,\n  p,\n  span {\n    max-width: 34em;\n  }\n"])));
-var ParagraphBase = (0, _styledComponents.default)(TypographyBase)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  p {\n    margin-block-start: 0;\n    margin-block-end: 0;\n  }\n  p:not(:only-of-type) {\n    margin-bottom: ", ";\n  }\n  ", "\n"])), function (props) {
-  return props.marginBetweenParagraphs || '0';
-}, ParagraphStyling);
-var ParagraphTextStyle;
-exports.ParagraphTextStyle = ParagraphTextStyle;
-
-(function (ParagraphTextStyle) {
-  ParagraphTextStyle[ParagraphTextStyle["Regular"] = 1] = "Regular";
-  ParagraphTextStyle[ParagraphTextStyle["Bold"] = 2] = "Bold";
-  ParagraphTextStyle[ParagraphTextStyle["Italic"] = 3] = "Italic";
-  ParagraphTextStyle[ParagraphTextStyle["Underline"] = 4] = "Underline";
-})(ParagraphTextStyle || (exports.ParagraphTextStyle = ParagraphTextStyle = {}));
-
-var paragraphFontWeight = function paragraphFontWeight(textStyle) {
-  var fontWeight = 400;
-
-  if (textStyle === ParagraphTextStyle.Bold) {
-    fontWeight = 700;
-  }
-
-  return fontWeight;
-};
-
-var paragraphFontStyle = function paragraphFontStyle(textStyle) {
-  var fontStyle = textStyle && textStyle === ParagraphTextStyle.Italic ? 'italic' : '';
-  return fontStyle;
-};
-
-var paragraphTextDecorationLine = function paragraphTextDecorationLine(textStyle) {
-  var textDecoration = textStyle && textStyle === ParagraphTextStyle.Underline ? 'underline' : 'none';
-  return textDecoration;
-};
-
-var ParagraphBaseStyling = function ParagraphBaseStyling(fontSize, lineHeight, textStyle, color) {
-  return (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n    font-style: ", ";\n    color: ", ";\n  "])), TYPOGRAPHY.fontFamily, fontSize, paragraphFontWeight(textStyle), lineHeight, paragraphFontStyle(textStyle), color);
-};
-
-var ParagraphXlStyling = function ParagraphXlStyling(textStyle, color) {
-  return ParagraphBaseStyling('24px', '36px', textStyle, color);
-};
-
-exports.ParagraphXlStyling = ParagraphXlStyling;
-
-var ParagraphXL = function ParagraphXL(_ref9) {
-  var color = _ref9.color,
-      textStyle = _ref9.textStyle,
-      children = _ref9.children;
-  var fontWeight = paragraphFontWeight(textStyle);
-  var fontStyle = paragraphFontStyle(textStyle);
-  var textDecorationLine = paragraphTextDecorationLine(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ParagraphBase, {
-    $color: color,
-    lineHeight: 36,
-    $fontSize: 24,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textDecorationLine: textDecorationLine,
-    marginBetweenParagraphs: "18px",
-    children: children
-  });
-};
-
-exports.ParagraphXL = ParagraphXL;
-ParagraphXL.propTypes = {
-  color: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ParagraphLStyling = function ParagraphLStyling(textStyle, color) {
-  return ParagraphBaseStyling('20px', '32px', textStyle, color);
-};
-
-exports.ParagraphLStyling = ParagraphLStyling;
-
-var ParagraphL = function ParagraphL(_ref10) {
-  var color = _ref10.color,
-      textStyle = _ref10.textStyle,
-      children = _ref10.children;
-  var fontWeight = paragraphFontWeight(textStyle);
-  var fontStyle = paragraphFontStyle(textStyle);
-  var textDecorationLine = paragraphTextDecorationLine(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ParagraphBase, {
-    $color: color,
-    lineHeight: 32,
-    $fontSize: 20,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textDecorationLine: textDecorationLine,
-    marginBetweenParagraphs: "16px",
-    children: children
-  });
-};
-
-exports.ParagraphL = ParagraphL;
-ParagraphL.propTypes = {
-  color: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ParagraphMStyling = function ParagraphMStyling(textStyle, color) {
-  return ParagraphBaseStyling('18px', '28px', textStyle, color);
-};
-
-exports.ParagraphMStyling = ParagraphMStyling;
-
-var ParagraphM = function ParagraphM(_ref11) {
-  var color = _ref11.color,
-      textStyle = _ref11.textStyle,
-      children = _ref11.children;
-  var fontWeight = paragraphFontWeight(textStyle);
-  var fontStyle = paragraphFontStyle(textStyle);
-  var textDecorationLine = paragraphTextDecorationLine(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ParagraphBase, {
-    $color: color,
-    lineHeight: 28,
-    $fontSize: 18,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textDecorationLine: textDecorationLine,
-    marginBetweenParagraphs: "14px",
-    children: children
-  });
-};
-
-exports.ParagraphM = ParagraphM;
-ParagraphM.propTypes = {
-  color: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ParagraphSStyling = function ParagraphSStyling(textStyle, color) {
-  return ParagraphBaseStyling('16px', '24px', textStyle, color);
-};
-
-exports.ParagraphSStyling = ParagraphSStyling;
-
-var ParagraphS = function ParagraphS(_ref12) {
-  var color = _ref12.color,
-      textStyle = _ref12.textStyle,
-      children = _ref12.children;
-  var fontWeight = paragraphFontWeight(textStyle);
-  var fontStyle = paragraphFontStyle(textStyle);
-  var textDecorationLine = paragraphTextDecorationLine(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ParagraphBase, {
-    $color: color,
-    lineHeight: 24,
-    $fontSize: 16,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textDecorationLine: textDecorationLine,
-    marginBetweenParagraphs: "12px",
-    children: children
-  });
-};
-
-exports.ParagraphS = ParagraphS;
-ParagraphS.propTypes = {
-  color: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ParagraphXSStyling = function ParagraphXSStyling(textStyle, color) {
-  return ParagraphBaseStyling('14px', '20px', textStyle, color);
-};
-
-exports.ParagraphXSStyling = ParagraphXSStyling;
-
-var ParagraphXS = function ParagraphXS(_ref13) {
-  var color = _ref13.color,
-      textStyle = _ref13.textStyle,
-      children = _ref13.children;
-  var fontWeight = paragraphFontWeight(textStyle);
-  var fontStyle = paragraphFontStyle(textStyle);
-  var textDecorationLine = paragraphTextDecorationLine(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ParagraphBase, {
-    $color: color,
-    lineHeight: 20,
-    $fontSize: 14,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textDecorationLine: textDecorationLine,
-    marginBetweenParagraphs: "10px",
-    children: children
-  });
-};
-
-exports.ParagraphXS = ParagraphXS;
-ParagraphXS.propTypes = {
-  color: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-var ComponentTextStyle;
-exports.ComponentTextStyle = ComponentTextStyle;
-
-(function (ComponentTextStyle) {
-  ComponentTextStyle[ComponentTextStyle["Regular"] = 1] = "Regular";
-  ComponentTextStyle[ComponentTextStyle["Bold"] = 2] = "Bold";
-  ComponentTextStyle[ComponentTextStyle["Italic"] = 3] = "Italic";
-  ComponentTextStyle[ComponentTextStyle["UppercaseBold"] = 4] = "UppercaseBold";
-})(ComponentTextStyle || (exports.ComponentTextStyle = ComponentTextStyle = {}));
-
-var componentFontWeight = function componentFontWeight(textStyle) {
-  var fontWeight = 400;
-
-  if (textStyle === ComponentTextStyle.Bold || textStyle === ComponentTextStyle.UppercaseBold) {
-    fontWeight = 700;
-  }
-
-  return fontWeight;
-};
-
-var componentFontStyle = function componentFontStyle(textStyle) {
-  var fontStyle = textStyle && textStyle === ComponentTextStyle.Italic ? 'italic' : '';
-  return fontStyle;
-};
-
-var componentTextTransformation = function componentTextTransformation(textStyle) {
-  var fontStyle = textStyle && textStyle === ComponentTextStyle.UppercaseBold ? 'uppercase' : 'none';
-  return fontStyle;
-};
-
-var ComponentStyling = function ComponentStyling(fontSize, lineHeight, textStyle, color) {
-  return (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n    font-family: ", ";\n    font-size: ", ";\n    font-weight: ", ";\n    line-height: ", ";\n    font-style: ", ";\n    ", "\n  "])), TYPOGRAPHY.fontFamily, fontSize, componentFontWeight(textStyle), lineHeight, componentFontStyle(textStyle), color === null ? '' : "color: ".concat(color || _.COLORS.black, ";"));
-};
-
-var ComponentXLStyling = function ComponentXLStyling(textStyle, color) {
-  return ComponentStyling('24px', '28px', textStyle, color);
-};
-
-exports.ComponentXLStyling = ComponentXLStyling;
-
-var ComponentXL = function ComponentXL(_ref14) {
-  var color = _ref14.color,
-      textStyle = _ref14.textStyle,
-      children = _ref14.children,
-      className = _ref14.className;
-  var fontWeight = componentFontWeight(textStyle);
-  var fontStyle = componentFontStyle(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TypographyBase, {
-    className: className,
-    $color: color,
-    lineHeight: 28,
-    $fontSize: 24,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    children: children
-  });
-};
-
-exports.ComponentXL = ComponentXL;
-ComponentXL.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ComponentLStyling = function ComponentLStyling(textStyle, color) {
-  return ComponentStyling('20px', '24px', textStyle, color);
-};
-
-exports.ComponentLStyling = ComponentLStyling;
-
-var ComponentL = function ComponentL(_ref15) {
-  var color = _ref15.color,
-      textStyle = _ref15.textStyle,
-      children = _ref15.children,
-      className = _ref15.className;
-  var fontWeight = componentFontWeight(textStyle);
-  var fontStyle = componentFontStyle(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TypographyBase, {
-    className: className,
-    $color: color,
-    lineHeight: 24,
-    $fontSize: 20,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    children: children
-  });
-};
-
-exports.ComponentL = ComponentL;
-ComponentL.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ComponentMStyling = function ComponentMStyling(textStyle, color) {
-  return ComponentStyling('18px', '24px', textStyle, color);
-};
-
-exports.ComponentMStyling = ComponentMStyling;
-
-var ComponentM = function ComponentM(_ref16) {
-  var color = _ref16.color,
-      textStyle = _ref16.textStyle,
-      children = _ref16.children,
-      className = _ref16.className;
-  var fontWeight = componentFontWeight(textStyle);
-  var fontStyle = componentFontStyle(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TypographyBase, {
-    className: className,
-    $color: color,
-    lineHeight: 24,
-    $fontSize: 18,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    children: children
-  });
-};
-
-exports.ComponentM = ComponentM;
-ComponentM.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ComponentSStyling = function ComponentSStyling(textStyle, color) {
-  return ComponentStyling('16px', '20px', textStyle, color);
-};
-
-exports.ComponentSStyling = ComponentSStyling;
-
-var ComponentS = function ComponentS(_ref17) {
-  var color = _ref17.color,
-      textStyle = _ref17.textStyle,
-      children = _ref17.children,
-      className = _ref17.className;
-  var fontWeight = componentFontWeight(textStyle);
-  var fontStyle = componentFontStyle(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TypographyBase, {
-    className: className,
-    $color: color,
-    lineHeight: 20,
-    $fontSize: 16,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    children: children
-  });
-};
-
-exports.ComponentS = ComponentS;
-ComponentS.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ComponentXSStyling = function ComponentXSStyling(textStyle, color) {
-  return ComponentStyling('14px', '16px', textStyle, color);
-};
-
-exports.ComponentXSStyling = ComponentXSStyling;
-
-var ComponentXS = function ComponentXS(_ref18) {
-  var color = _ref18.color,
-      textStyle = _ref18.textStyle,
-      children = _ref18.children,
-      className = _ref18.className;
-  var fontWeight = componentFontWeight(textStyle);
-  var fontStyle = componentFontStyle(textStyle);
-  var textTransform = componentTextTransformation(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TypographyBase, {
-    className: className,
-    $color: color,
-    lineHeight: 16,
-    $fontSize: 14,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textTransform: textTransform,
-    children: children
-  });
-};
-
-exports.ComponentXS = ComponentXS;
-ComponentXS.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ComponentXXSStyling = function ComponentXXSStyling(textStyle, color) {
-  return ComponentStyling('12px', '16px', textStyle, color);
-};
-
-exports.ComponentXXSStyling = ComponentXXSStyling;
-
-var ComponentXXS = function ComponentXXS(_ref19) {
-  var color = _ref19.color,
-      textStyle = _ref19.textStyle,
-      children = _ref19.children,
-      className = _ref19.className;
-  var fontWeight = componentFontWeight(textStyle);
-  var fontStyle = componentFontStyle(textStyle);
-  var textTransform = componentTextTransformation(textStyle);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(TypographyBase, {
-    className: className,
-    $color: color,
-    lineHeight: 16,
-    $fontSize: 12,
-    $fontWeight: fontWeight,
-    $fontStyle: fontStyle,
-    textTransform: textTransform,
-    children: children
-  });
-};
-
-exports.ComponentXXS = ComponentXXS;
-ComponentXXS.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-
-var ComponentResponsive = function ComponentResponsive(_ref20) {
-  var color = _ref20.color,
-      textStyle = _ref20.textStyle,
-      children = _ref20.children,
-      size = _ref20.size,
-      width = _ref20.width;
-  var fontsize = size;
-
-  if (!size) {
-    if (width < 768) {
-      fontsize = _types.Size.Small;
-    } else if (width < 992) {
-      fontsize = _types.Size.Medium;
-    } else {
-      fontsize = _types.Size.Large;
-    }
-  }
-
-  switch (fontsize) {
-    case _types.Size.XXSmall:
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentXXS, {
-        color: color,
-        textStyle: textStyle,
-        children: children
-      });
-
-    case _types.Size.XSmall:
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentXS, {
-        color: color,
-        textStyle: textStyle,
-        children: children
-      });
-
-    case _types.Size.Small:
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentS, {
-        color: color,
-        textStyle: textStyle,
-        children: children
-      });
-
-    case _types.Size.Medium:
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentM, {
-        color: color,
-        textStyle: textStyle,
-        children: children
-      });
-
-    case _types.Size.Large:
-    default:
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ComponentL, {
-        color: color,
-        textStyle: textStyle,
-        children: children
-      });
-  }
-};
-
-exports.ComponentResponsive = ComponentResponsive;
-ComponentResponsive.propTypes = {
-  color: _propTypes.default.string,
-  className: _propTypes.default.string,
-  textStyle: _propTypes.default.oneOf([1, 2, 3, 4])
-};
-//# sourceMappingURL=typography.js.map