Value formatting
Localization goes beyond translation by adapting data formats to match the user's locale. @localizer offers configurable data formatters for common scenarios, including:
The library provides a set of preconfigured formatters for common use cases, reducing the need for custom implementations.
What are formatters?
A formatter is a function that takes input and returns a localizable value. This allows formatted values to be used directly in UI components, template literals, or translations.
The library offers several predefined formatter types:
ValueFormatter<T>
ValueFormatter<T>
formats a single value of type T
into a localizable representation, suitable for standalone values like numbers, dates, or strings.
UnitValueFormatter<T, U>
UnitValueFormatter<T, U>
formats a value of type T
with an associated unit of type U
, such as distances (12 km) or monetary amounts ($123.00). It ensures the output respects the user's locale and conventions.
ValueRangeFormatter<T>
ValueRangeFormatter<T>
formats a range of values, taking two arguments of type T
(start and end). It returns a localizable representation that aligns with the user's locale and formatting preferences.
RelativeValueFormatter<T>
RelativeValueFormatter<T>
formats relative values using two arguments of type T
: the value and a reference. It is ideal for representing changes (+20%) or time relative to an event (5 minutes ago).
NOTE
Developers can create custom formatters for scenarios requiring more than the predefined options. Custom formatters must return a Localizable
value, enabling flexibility for unique formatting needs.
Best practice
Centralize all formatters to ensure consistent data formatting across your application. This simplifies updates and ensures uniformity in formatting rules.