
import { UniversalTextProps } from "../types/dist/index.js";
import * as _$react from "react";
import { JSX, ReactNode, Ref } from "react";

//#region src/components/Text.d.ts
type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
type VariantWithInherit = Exclude<UniversalTextProps['variant'], undefined> | 'inherit';
type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
  /** Ref passed to the inner container. */ref?: Ref<HTMLElement>; /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
  as?: TagName;
  /**
   * Applies italic styling. Works with both traditional fonts (via font-style: italic)
   * and variable fonts like YA Sans (via the ital axis in font-variation-settings).
   */
  italic?: boolean;
  /**
   * Applies tabular numbers styling (font-variant-numeric: tabular-nums).
   * Makes all digits the same width, useful for aligning numbers in tables or financial data.
   */
  tabularNumbers?: boolean;
  variant?: VariantWithInherit;
  color?: ColorWithInherit;
  children?: ReactNode;
  htmlFor?: string;
} & Omit<JSX.IntrinsicElements[TagName], 'children' | 'htmlFor'> & Omit<UniversalTextProps, 'variant' | 'color'>;
/**
 * **💬 A text element that can be used to display text**
 *
 * @description
 * By default, the `Text` component uses text primary color and selects the
 * correct font, weight, and leading. It also choices appropriate semantic
 * HTML element based on the `variant` prop. For example, `body1` will use a
 * `<p>` tag, `title1` uses an `<h1>`, etc. This behavior can be overridden
 * with the `as` prop.
 *
 *
 * @example
 * ```tsx
 * import { Text } from '@yahoo/uds';
 *
 * <Text variant="body1" color="primary">
 *   Text goes here
 * </Text>
 * ```
 *
 * @usage
 * - Use `Text` to display text in your app.
 * - Use `variant` to change the size and weight of the text.
 * - Use `color` to change the color of the text.
 * - Use `as` to change the HTML tag used to render the text.
 *
 * @see The {@link https://uds.build/docs/components/text Text Docs} for more info
 */
declare const Text: _$react.ForwardRefExoticComponent<Omit<TextProps<TextElementTagName>, "ref"> & _$react.RefAttributes<HTMLElement>>;
//#endregion
export { Text, type TextProps };