@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.
59 lines (58 loc) • 2.07 kB
JavaScript
;
"use client";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
exports.__esModule = true;
exports.default = void 0;
var React = _interopRequireWildcard(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _consts = require("./consts");
var _textAlign = require("../common/tailwind/textAlign");
var _spaceAfter = require("../common/tailwind/spaceAfter");
var _consts2 = require("../utils/mediaQuery/consts");
var _twClasses = require("./twClasses");
const Heading = ({
children,
type = _consts.TYPE_OPTIONS.TITLE1,
align = _consts.ALIGN.START,
as: Component = _consts.ELEMENT_OPTIONS.DIV,
dataTest,
inverted = false,
spaceAfter,
dataA11ySection,
id,
mediumMobile,
largeMobile,
tablet,
desktop,
largeDesktop
}) => {
const viewportSpecs = {
mediumMobile,
largeMobile,
tablet,
desktop,
largeDesktop
};
const viewportClasses = Object.values(_consts2.QUERIES).map(viewport => {
const viewportProps = viewportSpecs[viewport];
if (viewportProps == null) {
return null;
}
const {
type: vpType,
align: vpAlign,
spaceAfter: vpSpaceAfter
} = viewportProps;
return [vpType && _twClasses.typeClasses[viewport][vpType], vpAlign && _textAlign.textAlignClasses[viewport][vpAlign], vpSpaceAfter && _spaceAfter.spaceAfterClasses[viewport][vpSpaceAfter]];
});
return /*#__PURE__*/React.createElement(Component, {
id: id,
"data-test": dataTest,
role: Component === "div" ? "heading" : undefined,
"data-a11y-section": dataA11ySection,
className: (0, _clsx.default)("orbit-heading font-base m-0", inverted ? "text-heading-foreground-inverted" : "text-heading-foreground", _twClasses.typeClasses[type], _textAlign.textAlignClasses[align], spaceAfter && _spaceAfter.spaceAfterClasses[spaceAfter], ...viewportClasses)
}, children);
};
var _default = Heading;
exports.default = _default;