material-you-react/src/primitive-components/typography/typography.tsx

26 lines
735 B
TypeScript

import { createElement, forwardRef } from 'react';
import { getTypographyRole } from './utils/get-typography-role';
import {
TypographyProps,
Typography as TypographyTargetRef,
} from './typography.types';
export const Typography = forwardRef<TypographyTargetRef, TypographyProps>(
({ size, role, children, ...props }, ref) => {
const typeElement = getTypographyRole(role, size);
const extraClasses =
`m3 m3-typography ${size && role ? `${role}-${size}` : ''}`.trimEnd();
return createElement(
typeElement,
{
...props,
ref: ref,
className: extraClasses,
},
children,
);
},
);