@gravity-ui/uikit/build/cjs/components/Text/Text.d.ts

Gravity UI base styling and components

import * as React from 'react';
import type { DOMProps, QAProps } from "../types.js";
import type { ColorTextBaseProps } from "./colorText/colorText.js";
import type { TextBaseProps } from "./text/text.js";
export interface TextProps<C extends React.ElementType = 'span'> extends Omit<TextBaseProps, 'ellipsisLines'>, ColorTextBaseProps, QAProps, DOMProps {
    /**
     * Ability to override default html tag
     */
    as?: C;
    ellipsisLines?: number;
}
type TextRef<C extends React.ElementType> = React.ComponentPropsWithRef<C>['ref'];
type TextPropsWithTypedAttrs<T extends React.ElementType> = TextProps<T> & Omit<React.ComponentPropsWithoutRef<T>, keyof TextProps<T>>;
/**
 * A component for working with typography.
 *
 * Storybook: https://preview.gravity-ui.com/uikit/?path=/story/components-text--default
 *
 * **Hint:** Hover on props in your editor to read jsdoc
 *
 * Provides a convenient API for working with mixins of typography and text colors. Just point at the prop in you favorite code editor and read the accompanying documentation via `jsdoc` on where to apply this or that font or color.
 *
 * ```jsx
 * import {Text} from '@gravity-ui/uikit';
 *
 * <Text variant="body-1" color="inherit" ellipsis>some test</Text>
 * ```
 *
 * You can also use a more flexible way of setting the style. "Gravity UI" also provide `text` utility function.
 *
 *```jsx
 * import {text} from '@gravity-ui/uikit';
 *
 * // textStyles = 'text text_variant_display-1 some-class-name'
 * const textStyles = text({variant: 'display-1'}, 'some-class-name');
 *
 * <span className={textStyles}>some text</span>
 * ```
 */
export declare const Text: (<C extends React.ElementType = "span">({ ref, ...props }: TextPropsWithTypedAttrs<C> & {
    ref?: TextRef<C>;
}) => React.ReactElement) & {
    displayName: string;
};
export {};