import { ReactNode } from 'react'; export type TextType = 'title' | 'body' | 'caption' | 'code'; export type TitleSize = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'; export type BodySize = 'xs' | 'sm' | 'md' | 'lg'; export type CaptionSize = 'xs' | 'md'; export type CodeSize = 'md'; export type BaseSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl'; export type TextWeight = 'regular' | 'medium' | 'semibold' | 'bold'; export type TextColor = 'primary' | 'secondary' | 'tertiary' | 'disabled' | 'on-color' | 'on-canvas-inverse' | 'brand' | 'brand-hover' | 'brand-pressed' | 'brand-selected' | 'success' | 'success-hover' | 'success-pressed' | 'success-selected' | 'warning' | 'warning-hover' | 'warning-pressed' | 'warning-selected' | 'danger' | 'danger-hover' | 'danger-pressed' | 'danger-selected' | 'info' | 'info-hover' | 'info-pressed' | 'info-selected' | 'link' | 'link-hover' | 'link-pressed' | 'link-visited' | 'all-colors-red' | 'all-colors-orange' | 'all-colors-yellow' | 'all-colors-lime' | 'all-colors-green' | 'all-colors-cyan' | 'all-colors-azure' | 'all-colors-blue' | 'all-colors-violet' | 'all-colors-magenta' | 'all-colors-rose'; export type TextSize = T extends 'title' ? TitleSize | BaseSize : T extends 'body' ? BodySize | BaseSize : T extends 'caption' ? CaptionSize | BaseSize : T extends 'code' ? CodeSize | BaseSize : never; export interface TextProps { /** Tipo de texto: title, body, caption, code */ type?: T; /** Tamaño del texto según el tipo */ size?: TextSize; /** Peso de la fuente */ weight?: TextWeight; /** Contenido del texto */ children: ReactNode; /** Clase CSS adicional */ className?: string; /** Elemento HTML a renderizar (por defecto: span para body/caption/code, h1-h6 para title) */ as?: keyof JSX.IntrinsicElements; /** Color del texto: puede ser un color del sistema de diseño o un color CSS personalizado */ color?: TextColor | (string & {}); /** @deprecated Usa 'color' en su lugar. Color del sistema de diseño */ textColor?: TextColor; /** * Si es true, el texto se trunca con ellipsis y, si `truncateTooltip` es true, muestra un tooltip * con el contenido completo al pasar el cursor cuando el texto está efectivamente truncado. */ truncateLabel?: boolean; /** * Si es true (por defecto) y `truncateLabel` es true, muestra el tooltip al truncar. * Si es false, solo se aplica truncado sin tooltip. */ truncateTooltip?: boolean; /** * Texto mostrado en el tooltip cuando hace falta (p. ej. `children` no es un string o se quiere * un texto distinto al visible). */ tooltipTitle?: ReactNode; } //# sourceMappingURL=text.d.ts.map