@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.
138 lines (120 loc) • 4.01 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.StyledText = void 0;
var React = _interopRequireWildcard(require("react"));
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _defaultTheme = _interopRequireDefault(require("../defaultTheme"));
var _consts = require("./consts");
var _getSpacingToken = _interopRequireDefault(require("../common/getSpacingToken"));
var _rtl = require("../utils/rtl");
var _TextLink = require("../TextLink");
const getTypeToken = ({
theme,
type
}) => {
const typeTokens = {
[_consts.TYPE_OPTIONS.PRIMARY]: theme.orbit.colorTextPrimary,
[_consts.TYPE_OPTIONS.SECONDARY]: theme.orbit.colorTextSecondary,
[_consts.TYPE_OPTIONS.INFO]: theme.orbit.colorTextInfo,
[_consts.TYPE_OPTIONS.SUCCESS]: theme.orbit.colorTextSuccess,
[_consts.TYPE_OPTIONS.WARNING]: theme.orbit.colorTextWarning,
[_consts.TYPE_OPTIONS.CRITICAL]: theme.orbit.colorTextCritical,
[_consts.TYPE_OPTIONS.WHITE]: theme.orbit.colorTextWhite
};
return typeTokens[type];
};
const getWeightToken = ({
theme,
weight
}) => {
const weightTokens = {
[_consts.WEIGHT_OPTIONS.NORMAL]: theme.orbit.fontWeightNormal,
[_consts.WEIGHT_OPTIONS.MEDIUM]: theme.orbit.fontWeightMedium,
[_consts.WEIGHT_OPTIONS.BOLD]: theme.orbit.fontWeightBold
};
return weightTokens[weight];
};
const getSizeToken = ({
theme,
size
}) => {
const sizeTokens = {
[_consts.SIZE_OPTIONS.LARGE]: theme.orbit.fontSizeTextLarge,
[_consts.SIZE_OPTIONS.NORMAL]: theme.orbit.fontSizeTextNormal,
[_consts.SIZE_OPTIONS.SMALL]: theme.orbit.fontSizeTextSmall
};
return sizeTokens[size];
};
const getLineHeightToken = ({
theme,
size
}) => {
const lineHeightTokens = {
[_consts.SIZE_OPTIONS.LARGE]: theme.orbit.lineHeightTextLarge,
[_consts.SIZE_OPTIONS.NORMAL]: theme.orbit.lineHeightTextNormal,
[_consts.SIZE_OPTIONS.SMALL]: theme.orbit.lineHeightTextSmall
};
return lineHeightTokens[size];
};
const StyledText = (0, _styledComponents.default)(({
element: TextElement,
children,
className,
dataTest,
id
}) => /*#__PURE__*/React.createElement(TextElement, {
className: className,
"data-test": dataTest,
id: id
}, children)).withConfig({
displayName: "Text__StyledText",
componentId: "sc-13j9opf-0"
})(["", ""], ({
theme,
align,
uppercase,
strikeThrough,
type,
italic
}) => (0, _styledComponents.css)(["font-family:", ";font-size:", ";font-weight:", ";color:", ";line-height:", ";text-align:", ";text-transform:", ";text-decoration:", ";font-style:", ";margin:0;margin-bottom:", ";a:not(", "){", "}"], theme.orbit.fontFamily, getSizeToken, getWeightToken, getTypeToken, getLineHeightToken, (0, _rtl.textAlign)(align), uppercase && `uppercase`, strikeThrough && `line-through`, italic && `italic`, _getSpacingToken.default, _TextLink.StyledTextLink, (0, _TextLink.getLinkStyle)({
theme,
type
}))); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198
exports.StyledText = StyledText;
StyledText.defaultProps = {
theme: _defaultTheme.default
};
const Text = ({
type = _consts.TYPE_OPTIONS.PRIMARY,
size = _consts.SIZE_OPTIONS.NORMAL,
weight = _consts.WEIGHT_OPTIONS.NORMAL,
align = _consts.ALIGN_OPTIONS.LEFT,
as = _consts.ELEMENT_OPTIONS.P,
uppercase,
italic,
strikeThrough,
dataTest,
spaceAfter,
children,
id
}) => {
return /*#__PURE__*/React.createElement(StyledText, {
id: id,
type: type,
size: size,
strikeThrough: strikeThrough,
weight: weight,
align: align,
element: as,
uppercase: uppercase,
italic: italic,
dataTest: dataTest,
spaceAfter: spaceAfter
}, children);
};
var _default = Text;
exports.default = _default;