@payfit/unity-components/dist/esm/components/text/Text.d.ts

import { VariantProps } from '@payfit/unity-themes';
import { HTMLAttributes, PropsWithChildren } from 'react';
import { text } from './Text.variants.js';
export type ValidTextElements = 'p' | 'span' | 'div' | 'abbr' | 'dfn' | 'displayHeading' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'em' | 'strong' | 'small';
export type TextProps = PropsWithChildren<HTMLAttributes<HTMLSpanElement> & {
    /**
     * The HTML element to render the text as. Defaults to a recommended element based on the variant.
     * @default 'span'
     */
    asElement?: ValidTextElements;
    /**
     * The language of the text content See https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang.
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang
     */
    lang?: HTMLSpanElement['lang'];
    /**
     * The typography variant to use.
     * @default 'inherit'
     */
    variant?: VariantProps<typeof text>['variant'];
    /**
     * The text's color. This can be any token under the `content` colors namespace.
     * @default 'inherit'
     */
    color?: VariantProps<typeof text>['color'];
    /**
     * Whether the text should be truncated to one line and have an ellipsis.
     * @default false
     */
    isTruncated?: boolean;
    /**
     * The number of lines to clamp the text to.
     * @default undefined
     */
    lineClamp?: number;
    /**
     * Additional class names to apply to the text.
     * @default undefined
     */
    className?: string;
    /**
     * Limits the visible width of the text to a given number of characters using the CSS `ch` unit.
     * @default undefined
     */
    maxWidthCh?: number;
}>;
/**
 * The `Text` component is used to render text with different variants and colors.
 */
declare const Text: import('react').ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & {
    /**
     * The HTML element to render the text as. Defaults to a recommended element based on the variant.
     * @default 'span'
     */
    asElement?: ValidTextElements;
    /**
     * The language of the text content See https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang.
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang
     */
    lang?: HTMLSpanElement["lang"];
    /**
     * The typography variant to use.
     * @default 'inherit'
     */
    variant?: VariantProps<typeof text>["variant"];
    /**
     * The text's color. This can be any token under the `content` colors namespace.
     * @default 'inherit'
     */
    color?: VariantProps<typeof text>["color"];
    /**
     * Whether the text should be truncated to one line and have an ellipsis.
     * @default false
     */
    isTruncated?: boolean;
    /**
     * The number of lines to clamp the text to.
     * @default undefined
     */
    lineClamp?: number;
    /**
     * Additional class names to apply to the text.
     * @default undefined
     */
    className?: string;
    /**
     * Limits the visible width of the text to a given number of characters using the CSS `ch` unit.
     * @default undefined
     */
    maxWidthCh?: number;
} & {
    children?: import('react').ReactNode | undefined;
} & import('react').RefAttributes<HTMLElement>>;
export { Text };