@patreon/studio
Version:
Patreon Studio Design System
24 lines • 1.22 kB
JSX
import cx from 'classnames';
import React from 'react';
import styled from 'styled-components';
import { classNameForBodyText } from '../../styles/classNameForBodyText';
import { classNameForTextColor } from '../../styles/classNameForTextColor';
import { classNameForTextLayout } from '../../styles/classNameForTextLayout';
import { tokens } from '../../tokens';
import styles from './BodyText.module.css';
export const BodyText = ({ as = 'p', size = 'md', weight = 'normal', color = tokens.global.content.regular.default, align, ellipsis, className, style, children, id, 'data-tag': dataTag, ...props }) => {
const Component = as;
const classList = cx(styles.root, classNameForBodyText({ size, weight }), classNameForTextColor({ color }), classNameForTextLayout({ align, ellipsis }), className);
return (<Component className={classList} style={style} id={id} data-tag={dataTag} {...props}>
{children}
</Component>);
};
/** @deprecated use `BodyText` with `className` and css modules instead. */
export const BodyTextWithCss = styled(BodyText).withConfig({
shouldForwardProp: (prop) => !['css'].includes(prop),
}) `
&& {
${({ css }) => css};
}
`;
//# sourceMappingURL=index.jsx.map