# @askrjs/themes/text

> Published API exports for @askrjs/themes/text.

Source: [https://askrjs.com/docs/reference/api/themes/text](https://askrjs.com/docs/reference/api/themes/text)

Status: stable. Packages: @askrjs/themes/text.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Exports

This entrypoint publishes 9 exports from the declarations shipped by @askrjs/themes.

### `Text`

```ts
Text: <TElement extends TextElement = "p">(props: TextProps<TElement>) => JSX.Element
```

Typography primitive: renders any {@link TextElement} (default `<p>`) and turns `size`/`tone`/`weight`/`font`/`numeric`/`wrap`/`truncate` into data attributes for CSS styling.

### `TextElement`

```ts
TextElement: "p" | "span" | "div" | "strong"
```

Element tags {@link Text} can render as via its `as` prop.

### `TextFont`

```ts
TextFont: "body" | "mono"
```

Font family modifier for {@link Text}.

### `TextNumeric`

```ts
TextNumeric: "normal" | "tabular"
```

Numeric glyph variant (e.g. tabular figures) for {@link Text}.

### `TextProps`

```ts
TextProps: TextIntrinsicProps<TElement> & {
  as?: TElement;
  size?: TextSize;
  tone?: TextTone;
  weight?: TextWeight;
  font?: TextFont;
  numeric?: TextNumeric;
  wrap?: TextWrap;
  truncate?: boolean;
  children?: unknown;
  ref?: Ref<HTMLElement>;
}
```

Props for the {@link Text} component, specialized for a given {@link TextElement} `TElement`.

- `as`: as?: TElement | undefined;

- `children`: children?: unknown;

- `font`: font?: TextFont | undefined;

- `numeric`: numeric?: TextNumeric | undefined;

- `ref`: ref?: Ref<HTMLElement>;

- `size`: size?: TextSize | undefined;

- `tone`: tone?: TextTone | undefined;

- `truncate`: truncate?: boolean | undefined;

- `weight`: weight?: TextWeight | undefined;

- `wrap`: wrap?: TextWrap | undefined;

### `TextSize`

```ts
TextSize: "sm" | "md" | "lg"
```

Font size modifier for {@link Text}.

### `TextTone`

```ts
TextTone: "default" | "muted" | "subtle" | "inverse" | "success" | "warning" | "danger" | "info"
```

Color tone modifier for {@link Text}.

### `TextWeight`

```ts
TextWeight: "normal" | "medium" | "semibold" | "bold"
```

Font weight modifier for {@link Text}.

### `TextWrap`

```ts
TextWrap: "normal" | "nowrap" | "anywhere"
```

White-space wrapping behavior for {@link Text}.

## Documentation navigation

[Previous](https://askrjs.com/docs/reference/api/themes/tabs/index.md) | [Next](https://askrjs.com/docs/reference/api/themes/textarea/index.md)