"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.text = exports.monospaced = exports.marker = exports.headings = exports.default = exports.UIText = void 0;

var _react = _interopRequireDefault(require("react"));

var _utils = require("../../../.storybook/utils");

var _index = require("../../index");

var _default = {
  component: _index.Heading1,
  title: (0, _utils.addStoryInGroup)(_utils.FOUNDATION, 'Typography')
};
exports.default = _default;
var color = 'teal';
var maxLines = undefined;
var tint = 'darkest';

var headings = function headings() {
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.Heading1, {
    color: color,
    maxLines: maxLines,
    tint: tint
  }, "Heading 1 / font-size: 24px / line-height: 30px / weight: bold (700) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.Heading2, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, "Heading 2 / font-size: 18px / line-height: 24px / weight: medium (500) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.Heading3, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, "Heading 3 / font-size: 16px / line-height: 21px / weight: medium (500) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.Heading4, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, "Heading 4 / font-size: 12px / line-height: 18px / weight: bold (700) / tracking: 0.6px"), /*#__PURE__*/_react.default.createElement(_index.Heading5, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, "Heading 5 / font-size: 14px / line-height: 18px / weight: semi bold (600) / tracking: 0"));
};

exports.headings = headings;

var text = function text() {
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.TextDisplay, {
    color: color,
    maxLines: maxLines,
    tint: tint
  }, /*#__PURE__*/_react.default.createElement("strong", null, "Text display"), " / font-size: 16px / line-height: 24px / weight: regular (400) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.TextBody, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, /*#__PURE__*/_react.default.createElement("strong", null, "Text body"), " / font-size: 14px / line-height: 21px / weight: regular (400) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.TextBodyCompact, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, /*#__PURE__*/_react.default.createElement("strong", null, "Text body compact"), " / font-size: 14px / line-height: 18px / weight: regular (400) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.TextSmall, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, /*#__PURE__*/_react.default.createElement("strong", null, "Text small"), " / font-size: 12px / line-height: 18px / weight: regular (400) / tracking: 0"));
};

exports.text = text;

var UIText = function UIText() {
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.UITextDisplay, {
    color: color,
    maxLines: maxLines,
    tint: tint
  }, /*#__PURE__*/_react.default.createElement("strong", null, "UI Text display"), " / font-size: 16px / line-height: 24px / weight: medium (500) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.UITextBody, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, /*#__PURE__*/_react.default.createElement("strong", null, "UI Text body"), " / font-size: 14px / line-height: 18px / weight: medium (500) / tracking: 0"), /*#__PURE__*/_react.default.createElement(_index.UITextSmall, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 4
  }, /*#__PURE__*/_react.default.createElement("strong", null, "UIText small"), " / font-size: 12px / line-height: 18px / weight: medium (500) / tracking: 0"));
};

exports.UIText = UIText;

var monospaced = function monospaced() {
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.Heading1, {
    color: color,
    maxLines: maxLines,
    tint: tint
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.Heading2, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 2
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.Heading3, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 2
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.Heading4, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 2
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.Heading5, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 2
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.TextDisplay, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 6
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.TextBody, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 2
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")), /*#__PURE__*/_react.default.createElement(_index.TextSmall, {
    color: color,
    maxLines: maxLines,
    tint: tint,
    marginTop: 2
  }, /*#__PURE__*/_react.default.createElement(_index.Monospaced, null, "1234567890")));
};

exports.monospaced = monospaced;

var marker = function marker() {
  return /*#__PURE__*/_react.default.createElement(_index.Heading3, {
    color: color,
    tint: tint
  }, "We can use our ", /*#__PURE__*/_react.default.createElement(_index.Marker, null, "Marker component"), " to highlight some keywords");
};

exports.marker = marker;
marker.parameters = {
  info: {
    propTables: [_index.Marker]
  }
};