ui-neu/dist/components/typography/Typography.js

Neu UI, a responsive React component library.

import _taggedTemplateLiteral from "/home/runner/work/neu_ui/neu_ui/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral";

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    color: rgb(139, 139, 139);\n    font-size: ", ";\n    font-weight: ", ";\n    margin-bottom: 0.5rem;\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

import React from "react";
// styled components is a tool that enables you to write your css in js, check docs
import styled from "styled-components";

var fontSize = function fontSize(input) {
  var size = "";

  switch (input) {
    case 'h1':
      size = "6rem";
      break;

    case 'h2':
      size = "5rem";
      break;

    case 'h3':
      size = "4rem";
      break;

    case 'h4':
      size = "3rem";
      break;

    case 'h5':
      size = "2rem";
      break;

    case 'h6':
      size = "1.5rem";
      break;

    case 'subtitle1':
      size = "1.2rem";
      break;

    case 'subtitle2':
      size = "1rem";
      break;

    case 'body1':
      size = "1.2rem";
      break;

    case 'body2':
      size = "1rem";
      break;

    default:
      return;
  }

  return size;
};

var fontWeight = function fontWeight(input) {
  var fontWeight = "";

  switch (input) {
    case 'subtitle2':
      fontWeight = "550";
      break;

    default:
      return;
  }

  return fontWeight;
}; // using the styled object


var StyledTypography = styled.h1(_templateObject(), function (props) {
  return fontSize(props.variant);
}, function (props) {
  return fontWeight(props.variant);
}); // user imports 'Typography' the function, which is why we're exporting 'Typography' and not styledTypography

export var Typography = function Typography(_ref) {
  var variant = _ref.variant,
      children = _ref.children;
  return /*#__PURE__*/React.createElement(StyledTypography, {
    variant: variant
  }, children);
};
Typography.defaultProps = {
  children: null
};