# General Translation React SDKs (gt-react, gt-next, gt-react-native): InlineTranslationOptions
URL: https://generaltranslation.com/en-US/docs/react/reference/types/inline-translation-options.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Options for passing variables and metadata to inline string translations. API reference for InlineTranslationOptions.

`InlineTranslationOptions` is the options object for inline string translations. It carries interpolation variables plus metadata such as context and an identifier. It is accepted by [`useGT`](/docs/react/reference/hooks/use-gt) and [`msg`](/docs/react/reference/functions/msg).

*These options apply wherever [`useGT`](/docs/react/reference/hooks/use-gt) and [`msg`](/docs/react/reference/functions/msg) are available — `gt-react`, `gt-next`, `gt-tanstack-start`, and `gt-react-native`. The named `GTTranslationOptions` type is exported by `gt-react`, `gt-next`, and `gt-react-native`; `gt-tanstack-start` re-exports the functions but not the type.*

## Overview [#overview]

Pass interpolation variables as plain keys, and translation metadata with `$`-prefixed keys.

```typescript
type InlineTranslationOptions = {
  [variable: string]: unknown; // interpolation variables
  $context?: string;
  $id?: string;
  $format?: string;
  $locale?: string;
  $maxChars?: number;
  $requiresReview?: boolean;
};
```

*Note: in `gt-react` v11, this options object is the exported `GTTranslationOptions` type. Variables are inserted into the translation but are never translated themselves.*

## Properties [#properties]

| Property | Description | Type |
| --- | --- | --- |
| [`variables`](#variables) | Interpolation values, keyed by name. | `Record<string, unknown>` |
| [`$context`](#context) | Disambiguation context for translators. | `string` |
| [`$id`](#id) | Stable entry identifier for the translation editor. | `string` |
| [`$format`](#format) | The data format for the message (e.g., ICU, STRING). | `string` |
| [`$locale`](#locale) | Override the target locale. | `string` |
| [`$maxChars`](#max-chars) | Requested maximum length for generated translations. | `number` |
| [`$requiresReview`](#requires-review) | Require human approval before use. | `boolean` |

### `variables` [#variables]

**Type** `Record<string, unknown>`

Any non-`$` key is treated as an interpolation variable. Reference it in the string with `{name}` syntax; its value is inserted into the translated string without being translated.

### `$context` [#context]

**Type** `string` · **Optional**

Context to refine the translation, used to resolve ambiguous phrases.

### `$id` [#id]

**Type** `string` · **Optional**

A stable identifier for the entry, used with the translation editor.

### `$format` [#format]

**Type** `string` · **Optional** · **Default** `ICU`

The data format for the message (e.g., ICU, STRING). Defaults to ICU.

### `$locale` [#locale]

**Type** `string` · **Optional**

Overrides the target locale for this translation.

### `$maxChars` [#max-chars]

**Type** `number` · **Optional**

Requests a positive-integer maximum character count from translation tooling. String interpolation also applies a runtime cutoff when a loaded translation exceeds the limit.

### `$requiresReview` [#requires-review]

**Type** `boolean` · **Optional**

When `true`, marks the translation as requiring human approval before it is used.

## Examples [#examples]

```tsx title="Component.tsx"
import { useGT } from 'gt-react';

const Component = () => {
  const gt = useGT();
  return <div>{gt('Hello, world!', { $context: 'a formal greeting' })}</div>;
};
```

```tsx title="Component.tsx"
import { useGT } from 'gt-react';

const Component = () => {
  const gt = useGT();
  return <div>{gt('Hello, {username}! How is your day?', { username: 'Brian123' })}</div>;
};
```

```tsx title="Component.tsx"
import { useGT } from 'gt-react';

// ICU message format formats variables
const Component = () => {
  const gt = useGT();
  return (
    <div>
      {gt('Your account balance: {dollars, number, ::currency/USD}!', { dollars: 1000000 })}
    </div>
  );
};
```

```tsx title="Component.tsx"
import { useGT } from 'gt-react';

const Component = () => {
  const gt = useGT();
  return <div>{gt('Welcome to our application', { $maxChars: 15 })}</div>;
};
```

`gt-react` supports [ICU message format](https://unicode-org.github.io/icu/userguide/format_parse/messages/) for formatting variables.

## Notes [#notes]

- `InlineTranslationOptions` is used with [`useGT`](/docs/react/reference/hooks/use-gt) and [`msg`](/docs/react/reference/functions/msg).
- For dictionary lookups, see [`DictionaryTranslationOptions`](/docs/react/reference/types/dictionary-translation-options).

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.