import React from 'react';
import PropTypes from 'prop-types';
import { TypographyVariant, TypographyParams } from '@splunk/themes/mixins';
import { ComponentProps } from '../utils/types';
type TypographyElementTypes = 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'blockquote' | 'dd' | 'dl' | 'dt' | 'figcaption' | 'figure' | 'li' | 'ol' | 'ul' | 'pre' | 'abbr' | 'cite' | 'code' | 'data' | 'dfn' | 'em' | 'label' | 'u' | 'time' | 'sup' | 'sub' | 'strong' | 'small' | 'samp' | 's' | 'var' | 'ruby' | 'rt' | 'rp';
interface TypographyPropsBase extends TypographyParams {
    /**
     * Tag for the element to render children content into.
     * Use the most semantically appropriate tag.
     * Layout elements like `div` are not allowed; use the `typography` mixin from `@splunk/themes` instead.
     */
    as: TypographyElementTypes;
    /**
     * Text and inline icons
     * */
    children: React.ReactNode;
    /**
     * Set the color to a system-standard color: e.g. `active` for `@splunk/themes/variables.contentColorActive`.
     */
    color?: 'active' | 'default' | 'disabled' | 'inverted' | 'muted' | 'inherit';
    /**
     * A React ref which is set to the DOM element when the component mounts, and null when it unmounts.
     */
    elementRef?: React.Ref<HTMLElement>;
    /**
     * Set the font-family to sans-serif or monospace based on current theme.
     */
    family?: 'sansSerif' | 'monospace' | 'title';
    /**
     * Set the line-height to a system-standard size.
     */
    lineHeight?: 'single' | 'tight' | 'snug' | 'comfortable' | 'relaxed' | 'spacious' | 'normal';
    /**
     * Set the size to a system-standard size.
     */
    size?: 24 | 20 | 18 | 16 | 14 | 12;
    /**
     * A variant from the Splunk Design System's Type: 'body', 'title1', 'title2', 'title3',
     * 'title4', 'title5', 'title6', 'largeBody', 'smallBody', 'monoBody', or 'monoSmallBody'.
     */
    variant?: TypographyVariant;
    /**
     * Set the font-weight to a system-standard value.
     *
     * The following standard weight names are supported, using camelCase syntax.
     * See: [font-weight | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight#common_weight_name_mapping)
     */
    weight?: 'light' | 'normal' | 'semiBold' | 'bold' | 'extraBold' | 'heavy';
    /**
     * Remove all browser-default styles and apply theme-specific defaults.
     */
    withReset?: boolean;
}
type TypographyProps = ComponentProps<TypographyPropsBase, TypographyElementTypes>;
/**
 * Typography renders text content with styling based on the Splunk Design System.
 */
export declare function Typography({ as, children, color, elementRef, family, lineHeight, size, variant, weight, withReset, ...otherProps }: TypographyProps): React.JSX.Element;
export declare namespace Typography {
    var propTypes: {
        as: PropTypes.Validator<string>;
        children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
        color: PropTypes.Requireable<string>;
        elementRef: PropTypes.Requireable<object>;
        family: PropTypes.Requireable<string>;
        lineHeight: PropTypes.Requireable<string>;
        size: PropTypes.Requireable<number>;
        variant: PropTypes.Requireable<"body" | "title1" | "title2" | "title3" | "title4" | "title5" | "title6" | "largeBody" | "smallBody" | "monoBody" | "monoSmallBody">;
        weight: PropTypes.Requireable<string>;
        withReset: PropTypes.Requireable<boolean>;
    };
}
export default Typography;