# General Translation Changelog: gt-react 10.13.0: t as a tagged template literal
URL: https://generaltranslation.com/en-US/blog/gt-react_v10_13_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2026-03-18

## Overview

As part of our [continued experimentation with moving away from React context](/devlog/gt-react_v10_12_0), `gt-react` now supports using [`t`](/docs/react/reference/functions/t-function) as a tagged template literal:

```jsx
import { t } from "gt-react/browser";

const greeting = t`Hello, ${name}!`;
```

This is an alternative syntax to the existing [`t()`](/docs/react/reference/functions/t-function) function call. Instead of writing ICU-style placeholders and passing an options object, you write a standard JavaScript template literal and variable interpolation is handled automatically.

## Before and after

```jsx
// Before — ICU placeholders + options object
t("Hello, {name}! You have {count} items.", { name, count })

// After — tagged template literal
t`Hello, ${name}! You have ${count} items.`
```

The tagged template form eliminates the need to name placeholders or duplicate variable references. You write your string the way you'd write any JavaScript template literal.

## No React context required

Like the [`t()`](/docs/react/reference/functions/t-function) function introduced in [gt-react@10.12.0](/devlog/gt-react_v10_12_0), the tagged template form doesn't depend on React context. It works anywhere in browser code:

- **Event handlers**: `` onClick={() => alert(t`Saved!`)} ``
- **Utility functions**: `` function formatError(code) { return t`Error: ${code}` } ``
- **Constants and config**: `` const LABELS = { save: t`Save`, cancel: t`Cancel` } ``
- **Outside React components entirely**

## Global registration

If you don't want to import [`t`](/docs/react/reference/functions/t-function) in every file, you can register it globally:

```js
// In your app's entry point (e.g., layout.tsx)
import "gt-react/macros";
```

This sets `globalThis.t`, making the tagged template available everywhere without an explicit import.

## Example

```jsx
import { t } from "gt-react/browser";

export function Greeting({ name }) {
  return <p>{t`Hello, ${name}!`}</p>;
}

export function SaveButton() {
  return (
    <button onClick={() => alert(t`Changes saved!`)}>
      {t`Save`}
    </button>
  );
}
```

Or with global registration:

```jsx
// No import needed — t is on globalThis
const LABELS = {
  save: t`Save`,
  cancel: t`Cancel`,
  delete: t`Delete`,
};
```

## Links

- [Previous dev log: moving away from React context (gt-react@10.12.0)](/devlog/gt-react_v10_12_0)
- [`t()` API reference](/docs/react/reference/functions/t-function)
- [PR #1118](https://github.com/generaltranslation/gt/pull/1118)

## Sitemap

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