# General Translation React SDKs (gt-react, gt-next, gt-react-native): `<Currency>`
URL: https://generaltranslation.com/ru/docs/react/reference/components/currency.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Форматирование денежных сумм для активной локали. Справка по API для компонента `<Currency>`.

Компонент `<Currency>` отображает числовое значение в формате валюты для активной локали. Он только форматирует значение и не выполняет конвертацию по обменному курсу.

*Доступно в `gt-react`, `gt-next`, `gt-tanstack-start` и `gt-react-native`.*

## Обзор [#overview]

Передайте сумму через `children` и укажите код `currency`.

```tsx
<Currency>{100}</Currency>
// Вывод: $100.00
```

Все форматирование выполняется локально с помощью [`Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat).

## Как это работает [#how-it-works]

* **Локальное форматирование.** Сумма форматируется в браузере с помощью `Intl.NumberFormat`. Её значение никогда не отправляется в API General Translation.
* **Без конвертации.** `<Currency>` форматирует символ, разделение разрядов и количество знаков после запятой для выбранной валюты и локали, но не выполняет конвертацию между валютами.
* **Определение локали.** Форматирование определяется активной локалью, если оно не переопределено с помощью `locales`.

## Props [#props]

| Prop                    | Описание                                                | Type                       | Необязательно | По умолчанию    |
| ----------------------- | ------------------------------------------------------- | -------------------------- | ------------- | --------------- |
| [`children`](#children) | Сумма для форматирования.                               | `number \| string`         | Нет           | —               |
| [`currency`](#currency) | Код валюты ISO 4217.                                    | `string`                   | Да            | `USD`           |
| [`options`](#options)   | Параметры `Intl.NumberFormat`.                          | `Intl.NumberFormatOptions` | Да            | `{}`            |
| [`locales`](#locales)   | Локаль, используемая вместо текущей для форматирования. | `string[]`                 | Да            | Активная локаль |
| [`name`](#name)         | Имя переменной для записи.                              | `string`                   | Да            | —               |

### `children` [#children]

**Тип** `number | string` · **Обязательно**

Сумма, которую нужно отформатировать в виде валюты. Перед форматированием строки преобразуются в числа.

### `currency` [#currency]

**Type** `string` · **Необязательно** · **По умолчанию** `USD`

Код валюты по стандарту ISO 4217, например `USD` или `EUR`. Определяет символ и формат.

### `options` [#options]

**Тип** `Intl.NumberFormatOptions` · **Необязательно** · **По умолчанию** `{}`

Свойство принимает [`Intl.NumberFormatOptions`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#options). Среди распространённых параметров:

| Параметр                   | Описание                                                                                    | Тип                                                                                                                  | Необязательно | По умолчанию                             |
| -------------------------- | ------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- | ------------- | ---------------------------------------- |
| `localeMatcher`            | Алгоритм сопоставления локалей.                                                             | `'lookup' \| 'best fit'`                                                                                             | Да            | `'best fit'`                             |
| `numberingSystem`          | Система нумерации, например `latn` или `arab`.                                              | `string`                                                                                                             | Да            | `'latn'`                                 |
| `style`                    | Стиль форматирования чисел.                                                                 | `'decimal' \| 'currency' \| 'percent' \| 'unit'`                                                                     | Да            | `'currency'`                             |
| `currency`                 | Код валюты ISO 4217. Если указан здесь, переопределяет свойство `currency` верхнего уровня. | `string`                                                                                                             | Да            | свойство `currency`                      |
| `currencyDisplay`          | Способ отображения валюты.                                                                  | `'code' \| 'symbol' \| 'narrowSymbol' \| 'name'`                                                                     | Да            | `'symbol'`                               |
| `currencySign`             | Стандартное или бухгалтерское обозначение отрицательных значений.                           | `'standard' \| 'accounting'`                                                                                         | Да            | `'standard'`                             |
| `unit`                     | Идентификатор единицы, используемый, если значение `style` изменено на `'unit'`.            | `string`                                                                                                             | Да            | —                                        |
| `unitDisplay`              | Ширина обозначения единицы.                                                                 | `'long' \| 'short' \| 'narrow'`                                                                                      | Да            | `'short'`                                |
| `minimumIntegerDigits`     | Минимальное количество цифр в целой части; более короткие значения дополняются нулями.      | `number` (`1`–`21`)                                                                                                  | Да            | `1`                                      |
| `minimumFractionDigits`    | Минимальное количество цифр после десятичного разделителя.                                  | `number` (`0`–`100`)                                                                                                 | Да            | Зависит от валюты                        |
| `maximumFractionDigits`    | Максимальное количество цифр после десятичного разделителя.                                 | `number` (`0`–`100`)                                                                                                 | Да            | Зависит от валюты                        |
| `minimumSignificantDigits` | Минимальное количество значащих цифр.                                                       | `number` (`1`–`21`)                                                                                                  | Да            | `1`                                      |
| `maximumSignificantDigits` | Максимальное количество значащих цифр.                                                      | `number` (`1`–`21`)                                                                                                  | Да            | `21`                                     |
| `roundingPriority`         | Определяет, что имеет приоритет: дробные или значащие цифры.                                | `'auto' \| 'morePrecision' \| 'lessPrecision'`                                                                       | Да            | `'auto'`                                 |
| `roundingIncrement`        | Шаг, используемый для выбранного разряда округления.                                        | `1 \| 2 \| 5 \| 10 \| 20 \| 25 \| 50 \| 100 \| 200 \| 250 \| 500 \| 1000 \| 2000 \| 2500 \| 5000`                    | Да            | `1`                                      |
| `roundingMode`             | Направление округления.                                                                     | `'ceil' \| 'floor' \| 'expand' \| 'trunc' \| 'halfCeil' \| 'halfFloor' \| 'halfExpand' \| 'halfTrunc' \| 'halfEven'` | Да            | `'halfExpand'`                           |
| `trailingZeroDisplay`      | Определяет, сохранять ли завершающие нули у целых чисел.                                    | `'auto' \| 'stripIfInteger'`                                                                                         | Да            | `'auto'`                                 |
| `notation`                 | Стандартная, научная, инженерная или компактная запись.                                     | `'standard' \| 'scientific' \| 'engineering' \| 'compact'`                                                           | Да            | `'standard'`                             |
| `compactDisplay`           | Полные или сокращённые обозначения для компактной записи.                                   | `'short' \| 'long'`                                                                                                  | Да            | `'short'`                                |
| `useGrouping`              | Когда отображать разделители групп разрядов.                                                | `boolean \| 'always' \| 'auto' \| 'min2'`                                                                            | Да            | `'auto'`; `'min2'` для компактной записи |
| `signDisplay`              | Когда отображать положительный или отрицательный знак.                                      | `'auto' \| 'always' \| 'exceptZero' \| 'negative' \| 'never'`                                                        | Да            | `'auto'`                                 |

Перед применением `options` компонент задаёт `style: 'currency'`, свойство `currency` верхнего уровня и `numberingSystem: 'latn'`. Поэтому значения, переданные через `options`, переопределяют эти значения по умолчанию.

* Значения по умолчанию для количества знаков после запятой в валюте определяются стандартным количеством её дробных единиц.
* `compactDisplay` применяется только при значении `notation` `'compact'`.
* `roundingIncrement` нельзя сочетать с округлением по значащим цифрам или со значением `roundingPriority`, отличным от `'auto'`.
* Поддерживаемые единицы, системы нумерации, параметры округления и значения параметров зависят от среды выполнения JavaScript.

Актуальные сведения о доступных параметрах и поведении среды выполнения см. в [документации по параметрам `Intl.NumberFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#options).

### `locales` [#locales]

**Тип** `string[]` · **Необязательно** · **По умолчанию** Активная локаль

Локали, для которых нужно выполнять форматирование. Если параметр не указан, используется активная локаль. См. [аргумент locales](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locales_argument).

### `name` [#name]

**Type** `string` · **Необязательный**

Необязательное название поля Currency, используемое для метаданных.

## Примеры [#examples]

*В примерах импорт выполняется из `gt-react`; вместо этого импортируйте из пакета своего фреймворка.*

```tsx title="PriceDisplay.tsx"
import { Currency } from 'gt-react';

export default function PriceDisplay({ item }) {
  return <Currency>{item.price}</Currency>; // [!code highlight]
}
```

```tsx title="PriceDisplay.tsx"
import { Currency } from 'gt-react';

export default function PriceDisplay({ item }) {
  return <Currency currency="EUR">{item.price}</Currency>; // [!code highlight]
}
```

```tsx title="PriceDisplay.tsx"
import { T, Currency } from 'gt-react';

export default function PriceDisplay({ item }) {
  return (
    <T>
      The price is <Currency>{item.price}</Currency>. // [!code highlight]
    </T>
  );
}
```

```tsx title="PriceDisplay.tsx"
import { Currency } from 'gt-react';

export default function PriceDisplay({ item }) {
  return (
    <Currency
      currency="GBP"
      options={{ // [!code highlight]
        currencyDisplay: 'narrowSymbol',
        minimumFractionDigits: 2,
        maximumFractionDigits: 2,
      }}
    >
      {item.price}
    </Currency>
  );
}
```

## Заметки [#notes]

* `<Currency>` форматирует денежные суммы для активной локали, но не выполняет конвертацию валют.
* Его содержимое форматируется локально и никогда не отправляется в API.

## Sitemap

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