@patreon/studio/module/components/DisplayText/index.jsx

Patreon Studio Design System

import cx from 'classnames';
import React from 'react';
import styled from 'styled-components';
import { classNameForDisplayText } from '../../styles/classNameForDisplayText';
import { classNameForTextColor } from '../../styles/classNameForTextColor';
import { classNameForTextLayout } from '../../styles/classNameForTextLayout';
import { tokens } from '../../tokens';
import styles from './DisplayText.module.css';
export const DisplayText = ({ as = 'h1', size = 'md', weight = 'medium', color = tokens.global.content.regular.default, align, ellipsis, className, style, children, id, 'data-tag': dataTag, ...props }) => {
    const Component = as;
    const classList = cx(styles.root, classNameForDisplayText({ size, weight }), classNameForTextColor({ color }), classNameForTextLayout({ align, ellipsis }), className);
    return (<Component className={classList} style={style} id={id} data-tag={dataTag} {...props}>
      {children}
    </Component>);
};
/** @deprecated use `DisplayText` with `className` and css modules instead. */
export const DisplayTextWithCss = styled(DisplayText) `
  && {
    ${({ css }) => css};
  }
`;
//# sourceMappingURL=index.jsx.map