@itwin/itwinui-react/esm/core/Typography/Text.d.ts

A react component library for iTwinUI

import * as React from 'react';
import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
type TextProps = {
    /**
     * Which typography variant/size should be used for the styling?
     *
     * 'headline' = h1,
     * 'title' = h2,
     * 'subheading' = h3,
     * 'leading' = h4,
     * 'body' = normal paragraph text,
     * 'small' = smaller text
     *
     * @default 'body'
     */
    variant?: 'headline' | 'title' | 'subheading' | 'leading' | 'body' | 'small';
    /**
     * Show text in muted style.
     * @default false
     */
    isMuted?: boolean;
    /**
     * Use it if you are still loading the content.
     * @default false
     */
    isSkeleton?: boolean;
};
/**
 * Polymorphic typography component to render any kind of text as any kind of element.
 * Users should decide which element to render based on the context of their app. Link to heading levels docs: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements#accessibility_concerns
 *
 * @example
 * <Text>Some normal paragraph text rendered as a div</Text>
 * @example
 * <Text variant='title' as='h3'>I'm some h2 text rendered as an h3 element!</Text>
 * @example
 * <Text isMuted>Some muted text.</Text>
 * <Text isSkeleton>Skeleton text</Text>
 */
export declare const Text: PolymorphicForwardRefComponent<"div", TextProps>;
export declare const TextContext: React.Context<boolean>;
export {};