baseui/typography/index.js

A React Component library implementing the Base design language

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ParagraphXSmall = exports.ParagraphSmall = exports.ParagraphMedium = exports.ParagraphLarge = exports.MonoParagraphXSmall = exports.MonoParagraphSmall = exports.MonoParagraphMedium = exports.MonoParagraphLarge = exports.MonoLabelXSmall = exports.MonoLabelSmall = exports.MonoLabelMedium = exports.MonoLabelLarge = exports.MonoHeadingXXLarge = exports.MonoHeadingXSmall = exports.MonoHeadingXLarge = exports.MonoHeadingSmall = exports.MonoHeadingMedium = exports.MonoHeadingLarge = exports.MonoDisplayXSmall = exports.MonoDisplaySmall = exports.MonoDisplayMedium = exports.MonoDisplayLarge = exports.LabelXSmall = exports.LabelSmall = exports.LabelMedium = exports.LabelLarge = exports.HeadingXXLarge = exports.HeadingXSmall = exports.HeadingXLarge = exports.HeadingSmall = exports.HeadingMedium = exports.HeadingLarge = exports.DisplayXSmall = exports.DisplaySmall = exports.DisplayMedium = exports.DisplayLarge = void 0;
var React = _interopRequireWildcard(require("react"));
var _block = require("../block");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
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); } /*
Copyright (c) Uber Technologies, Inc.

This source code is licensed under the MIT license found in the
LICENSE file in the root directory of this source tree.
*/
const DisplayLarge = exports.DisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-displaylarge"
}, props, {
  font: props.font || 'DisplayLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
DisplayLarge.displayName = 'DisplayLarge';
const DisplayMedium = exports.DisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-displaymedium"
}, props, {
  font: props.font || 'DisplayMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
DisplayMedium.displayName = 'DisplayMedium';
const DisplaySmall = exports.DisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-displaysmall"
}, props, {
  font: props.font || 'DisplaySmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
DisplaySmall.displayName = 'DisplaySmall';
const DisplayXSmall = exports.DisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-displayxsmall"
}, props, {
  font: props.font || 'DisplayXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
DisplayXSmall.displayName = 'DisplayXSmall';
const HeadingXXLarge = exports.HeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-headingxxlarge",
  as: props.as || 'h1'
}, props, {
  font: props.font || 'HeadingXXLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
HeadingXXLarge.displayName = 'HeadingXXLarge';
const HeadingXLarge = exports.HeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-headingxlarge",
  as: props.as || 'h2'
}, props, {
  font: props.font || 'HeadingXLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
HeadingXLarge.displayName = 'HeadingXLarge';
const HeadingLarge = exports.HeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-headinglarge",
  as: props.as || 'h3'
}, props, {
  font: props.font || 'HeadingLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
HeadingLarge.displayName = 'HeadingLarge';
const HeadingMedium = exports.HeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-headingmedium",
  as: props.as || 'h4'
}, props, {
  font: props.font || 'HeadingMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
HeadingMedium.displayName = 'HeadingMedium';
const HeadingSmall = exports.HeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-headingsmall",
  as: props.as || 'h5'
}, props, {
  font: props.font || 'HeadingSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
HeadingSmall.displayName = 'HeadingSmall';
const HeadingXSmall = exports.HeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-headingxsmall",
  as: props.as || 'h6'
}, props, {
  font: props.font || 'HeadingXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
HeadingXSmall.displayName = 'HeadingXSmall';
const LabelLarge = exports.LabelLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-labellarge"
}, props, {
  font: props.font || 'LabelLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
LabelLarge.displayName = 'LabelLarge';
const LabelMedium = exports.LabelMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-labelmedium"
}, props, {
  font: props.font || 'LabelMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
LabelMedium.displayName = 'LabelMedium';
const LabelSmall = exports.LabelSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-labelsmall"
}, props, {
  font: props.font || 'LabelSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
LabelSmall.displayName = 'LabelSmall';
const LabelXSmall = exports.LabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-labelxsmall"
}, props, {
  font: props.font || 'LabelXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
LabelXSmall.displayName = 'LabelXSmall';
const ParagraphLarge = exports.ParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-paragraphlarge",
  as: props.as || 'p'
}, props, {
  font: props.font || 'ParagraphLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
ParagraphLarge.displayName = 'ParagraphLarge';
const ParagraphMedium = exports.ParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-paragraphmedium",
  as: props.as || 'p'
}, props, {
  font: props.font || 'ParagraphMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
ParagraphMedium.displayName = 'ParagraphMedium';
const ParagraphSmall = exports.ParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-paragraphsmall",
  as: props.as || 'p'
}, props, {
  font: props.font || 'ParagraphSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
ParagraphSmall.displayName = 'ParagraphSmall';
const ParagraphXSmall = exports.ParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-paragraphxsmall",
  as: props.as || 'p'
}, props, {
  font: props.font || 'ParagraphXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
ParagraphXSmall.displayName = 'ParagraphXSmall';
const MonoDisplayLarge = exports.MonoDisplayLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monodisplaylarge"
}, props, {
  font: props.font || 'MonoDisplayLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoDisplayLarge.displayName = 'MonoDisplayLarge';
const MonoDisplayMedium = exports.MonoDisplayMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monodisplaymedium"
}, props, {
  font: props.font || 'MonoDisplayMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoDisplayMedium.displayName = 'MonoDisplayMedium';
const MonoDisplaySmall = exports.MonoDisplaySmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monodisplaysmall"
}, props, {
  font: props.font || 'MonoDisplaySmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoDisplaySmall.displayName = 'MonoDisplaySmall';
const MonoDisplayXSmall = exports.MonoDisplayXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monodisplayxsmall"
}, props, {
  font: props.font || 'MonoDisplayXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoDisplayXSmall.displayName = 'MonoDisplayXSmall';
const MonoHeadingXXLarge = exports.MonoHeadingXXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoheadingxxlarge",
  as: props.as || 'h1'
}, props, {
  font: props.font || 'MonoHeadingXXLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoHeadingXXLarge.displayName = 'MonoHeadingXXLarge';
const MonoHeadingXLarge = exports.MonoHeadingXLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoheadingxlarge",
  as: props.as || 'h2'
}, props, {
  font: props.font || 'MonoHeadingXLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoHeadingXLarge.displayName = 'MonoHeadingXLarge';
const MonoHeadingLarge = exports.MonoHeadingLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoheadinglarge",
  as: props.as || 'h3'
}, props, {
  font: props.font || 'MonoHeadingLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoHeadingLarge.displayName = 'MonoHeadingLarge';
const MonoHeadingMedium = exports.MonoHeadingMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoheadingmedium",
  as: props.as || 'h4'
}, props, {
  font: props.font || 'MonoHeadingMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoHeadingMedium.displayName = 'MonoHeadingMedium';
const MonoHeadingSmall = exports.MonoHeadingSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoheadingsmall",
  as: props.as || 'h5'
}, props, {
  font: props.font || 'MonoHeadingSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoHeadingSmall.displayName = 'MonoHeadingSmall';
const MonoHeadingXSmall = exports.MonoHeadingXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoheadingxsmall",
  as: props.as || 'h6'
}, props, {
  font: props.font || 'MonoHeadingXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoHeadingXSmall.displayName = 'MonoHeadingXSmall';
const MonoLabelLarge = exports.MonoLabelLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monolabellarge"
}, props, {
  font: props.font || 'MonoLabelLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoLabelLarge.displayName = 'MonoLabelLarge';
const MonoLabelMedium = exports.MonoLabelMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monolabelmedium"
}, props, {
  font: props.font || 'MonoLabelMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoLabelMedium.displayName = 'MonoLabelMedium';
const MonoLabelSmall = exports.MonoLabelSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monolabelsmall"
}, props, {
  font: props.font || 'MonoLabelSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoLabelSmall.displayName = 'MonoLabelSmall';
const MonoLabelXSmall = exports.MonoLabelXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monolabelxsmall"
}, props, {
  font: props.font || 'MonoLabelXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoLabelXSmall.displayName = 'MonoLabelXSmall';
const MonoParagraphLarge = exports.MonoParagraphLarge = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoparagraphlarge",
  as: props.as || 'p'
}, props, {
  font: props.font || 'MonoParagraphLarge',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoParagraphLarge.displayName = 'MonoParagraphLarge';
const MonoParagraphMedium = exports.MonoParagraphMedium = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoparagraphmedium",
  as: props.as || 'p'
}, props, {
  font: props.font || 'MonoParagraphMedium',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoParagraphMedium.displayName = 'MonoParagraphMedium';
const MonoParagraphSmall = exports.MonoParagraphSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoparagraphsmall",
  as: props.as || 'p'
}, props, {
  font: props.font || 'MonoParagraphSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoParagraphSmall.displayName = 'MonoParagraphSmall';
const MonoParagraphXSmall = exports.MonoParagraphXSmall = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(_block.Block, _extends({
  "data-baseweb": "typo-monoparagraphxsmall",
  as: props.as || 'p'
}, props, {
  font: props.font || 'MonoParagraphXSmall',
  color: props.color || 'contentPrimary',
  ref: ref
})));
MonoParagraphXSmall.displayName = 'MonoParagraphXSmall';