import * as React from 'react'; import { EllipsisCommonProps } from '../common/Ellipsis'; import { TooltipCommonProps } from '../common'; import { ValuesOf } from '../utils/typeUtils'; import { WEIGHTS, SKINS, SIZES } from './constants'; export type TextWithAsProp = TextAsSpanProps | TextAsAnchorProps | TextAsLabelProps | TextGenericProps | TextAsComponentProps; type TextAsSpanProps = React.HTMLAttributes & T & { /** Defines a tag name that text should be rendered inside of (e.g., div, a, p). */ tagName?: 'span'; /** Defines a callback function which is called when the text is clicked. */ onClick?: React.MouseEventHandler; }; type TextAsAnchorProps = React.AnchorHTMLAttributes & T & { /** Defines a tag name that text should be rendered inside of (e.g., div, a, p). */ tagName: 'a'; /** Defines a callback function which is called when the text is clicked. */ onClick?: React.MouseEventHandler; }; type TextAsLabelProps = React.LabelHTMLAttributes & T & { /** Defines a tag name that text should be rendered inside of (e.g., div, a, p). */ tagName: 'label'; }; type TextGenericProps = T & { /** Defines a tag name that text should be rendered inside of (e.g., div, a, p). */ tagName: keyof Omit; /** Defines a callback function which is called when the text is clicked. */ onClick?: React.MouseEventHandler; [additionalProps: string]: any; }; type TextAsComponentProps = T & { /** Defines a tag name that text should be rendered inside of (e.g., div, a, p). */ tagName: React.ComponentType; /** Defines a callback function which is called when the text is clicked. */ onClick?: React.MouseEventHandler; [additionalProps: string]: any; }; export type TextPropsBase = Omit & { /** Applies a data-hook HTML attribute that can be used in the tests. */ dataHook?: string; /** Defines a tag name that text should be rendered inside of (e.g., div, a, p). */ tagName?: string; /** Specifies a CSS class name to be appended to the component's root element. * @internal */ className?: string; /** Controls the font size of the text. */ size?: TextSize; /** Sets text type to secondary. Affects font color only. */ secondary?: boolean; /** Controls the skin of the text. */ skin?: TextSkin; /** Inverts text color so it can be used on dark backgrounds. */ light?: boolean; /** Controls the font weight of the text. */ weight?: TextWeight; /** Sets list items style. */ listStyle?: ListStyle; /** Allows to pass all common tooltip props. * @linkTypeTo Tooltip * @setTypeName TooltipCommonProps */ tooltipProps?: TooltipCommonProps; /** Applies id HTML attribute. */ id?: string; /** if true it will support widows in the text. */ widows?: boolean; /** Renders any kind of content within a heading. Usually it's a text string. */ children?: React.ReactNode; /** Component displayed at the end of text, after ellipsis if truncated. * @internal */ suffix?: React.ReactNode; /** Sets "overflow-wrap" CSS property. Controls how text will behave upon overflowing parent component. */ overflowWrap?: OverflowWrap; /** A callback fired when ellipsis state changes. */ onEllipsisStateChange?: (isActive: boolean) => void; }; export type TextProps = TextWithAsProp; export type TextSize = ValuesOf; export type TextSkin = ValuesOf; export type TextWeight = ValuesOf; export type ListStyle = 'checkmark' | 'circle'; export type OverflowWrap = 'normal' | 'break-word' | 'anywhere'; export {}; //# sourceMappingURL=Text.types.d.ts.map