@stihl-design-system/components
Version:
Welcome to the STIHL Design System react component library.
31 lines (30 loc) • 1.34 kB
TypeScript
import { HTMLAttributes, JSX } from 'react';
import { Theme } from '../../types';
import { TextUtilitySize, TextUtilityTag, TextUtilityWeight } from './TextUtility.utils';
export interface TextUtilityProps extends HTMLAttributes<HTMLQuoteElement | HTMLDivElement | HTMLLegendElement | HTMLParagraphElement | HTMLSpanElement | HTMLTimeElement> {
/** Content of the text. */
children: React.ReactNode;
/** Size of the text.
* @default 'medium'
*/
size?: TextUtilitySize;
/** Specifies the HTML tag to be used for the text.
* @default 'p'
*/
tag?: TextUtilityTag;
/** Defines the theme.
* @default 'light'
*/
theme?: Theme;
/** Defines the weight. **Weight 'demi' is only supported on sizes 'small' and 'x-small'. Size 'x-small' only supports 'demi' weight.**.
* @default 'normal'
*/
weight?: TextUtilityWeight;
}
/**
* The `DSTextUtility` component is optimized for utility text use-cases
* (labels, captions, UI text) and maps directly to the SCSS utility typography mixins.
*
* Design in Figma: [Text](https://www.figma.com/design/d9wrOp4aCplDsV9AVC87Xn/Typography-%F0%9F%85%B0%EF%B8%8F?node-id=3-2301&t=TeSgud7dB5pnld5s-11)
*/
export declare const DSTextUtility: ({ children, className, size, tag, theme, weight, ...rest }: TextUtilityProps) => JSX.Element;