import * as React from 'react';
import { DefaultComponentProps, SxProps } from '../styled';
import { ThemeColorFGTokenName, ThemeTypeTokenName } from '../theme/tokens';
import { TextClasses } from './text-classes';
import { TypographyOwnProps } from '@mui/material/Typography';
export type LiteralUnion<LiteralType> = LiteralType | (string & Record<never, never>);
export type ITextProps<RootComponent extends React.ElementType = 'span'> = DefaultComponentProps<{
    props: Omit<TypographyOwnProps, 'as' | 'component' | 'sx' | 'variant' | 'color' | 'align' | 'classes' | 'gutterBottom' | 'noWrap' | 'paragraph'> & {
        /**
         * Set the text-align on the component.
         * @default 'inherit'
         */
        align?: 'inherit' | 'left' | 'center' | 'right' | 'justify';
        /**
         * The content of the component.
         */
        children?: React.ReactNode;
        /**
         * Override or extend the styles applied to the component.
         */
        classes?: Partial<TextClasses>;
        /**
         * The color of the text. Only foreground tokens are supported.
         */
        color?: LiteralUnion<ThemeColorFGTokenName>;
        /**
         * The component used for the root node.
         * Either a string to use a HTML element or a component.
         */
        component?: React.ElementType;
        /**
         * If `true`, the text will have a bottom margin.
         * @default false
         */
        gutterBottom?: boolean;
        /**
         * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
         *
         * Note that text overflow can only happen with block or inline-block level elements
         * (the element needs to have a width in order to overflow).
         * @default false
         */
        noWrap?: boolean;
        /**
         * If `true`, the element will be a paragraph element.
         * @default false
         */
        paragraph?: boolean;
        sx?: SxProps;
        /**
         * The color of the text. Only foreground tokens are supported.
         */
        variant?: ThemeTypeTokenName | TypographyOwnProps['variant'];
    };
    defaultComponent: RootComponent;
}>;
export declare const textVariantMapping: Partial<Record<ThemeTypeTokenName, React.ElementType>>;
export declare const Text: React.ForwardRefExoticComponent<Omit<TypographyOwnProps, "color" | "as" | "align" | "classes" | "sx" | "variant" | "gutterBottom" | "noWrap" | "paragraph" | "component"> & {
    /**
     * Set the text-align on the component.
     * @default 'inherit'
     */
    align?: "inherit" | "left" | "center" | "right" | "justify";
    /**
     * The content of the component.
     */
    children?: React.ReactNode;
    /**
     * Override or extend the styles applied to the component.
     */
    classes?: Partial<TextClasses>;
    /**
     * The color of the text. Only foreground tokens are supported.
     */
    color?: LiteralUnion<ThemeColorFGTokenName>;
    /**
     * The component used for the root node.
     * Either a string to use a HTML element or a component.
     */
    component?: React.ElementType;
    /**
     * If `true`, the text will have a bottom margin.
     * @default false
     */
    gutterBottom?: boolean;
    /**
     * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
     *
     * Note that text overflow can only happen with block or inline-block level elements
     * (the element needs to have a width in order to overflow).
     * @default false
     */
    noWrap?: boolean;
    /**
     * If `true`, the element will be a paragraph element.
     * @default false
     */
    paragraph?: boolean;
    sx?: SxProps;
    /**
     * The color of the text. Only foreground tokens are supported.
     */
    variant?: ThemeTypeTokenName | TypographyOwnProps["variant"];
} & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "p" | "ref" | "border" | "color" | "left" | "right" | "bottom" | "top" | "flex" | "position" | "padding" | "alignContent" | "alignItems" | "alignSelf" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "visibility" | "whiteSpace" | "width" | "zIndex" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "paddingBlock" | "paddingInline" | "children" | "align" | "bgcolor" | "classes" | "sx" | "variant" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping" | "component"> & React.RefAttributes<HTMLAnchorElement>>;