Published on
2 min read

generaltranslation@7.8.0

Authors

Overview

In generaltranslation@7.8.0, we're introducing list formatting capabilities that set the foundation for upcoming components and methods. This release adds formatListToParts() to both the GT class and as a standalone function.


Motivation

Lists of items require proper locale-aware formatting. Specifically, we wanted to add the ability to join multiple items (not just strings) into a formatted list. This sets us up nicely for creating lists of arbitrary data, such as JSX elements.


Usage

The new formatListToParts() function preserves the original types of list items while inserting appropriate locale-specific separators:

import { GT, formatListToParts } from 'generaltranslation'

const gt = new GT({ locales: ['en'] })

// Mixed data types
gt.formatListToParts(['apple', 42, { type: 'fruit' }])
// Returns: ['apple', ', ', 42, ', and ', { type: 'fruit' }]

// Standalone function
formatListToParts(['red', 'green', 'blue'], {
  locales: ['es'],
  type: 'disjunction',
})
// Returns: ['red', ', ', 'green', ' o ', 'blue']

Different list types and styles are supported:

// Disjunction (or)
gt.formatListToParts(['A', 'B', 'C'], { type: 'disjunction' })
// Returns: ['A', ', ', 'B', ', or ', 'C']

// Short style
gt.formatListToParts(['first', 'second'], { style: 'short' })
// Returns: ['first', ' & ', 'second']

// Unit formatting
gt.formatListToParts(['1km', '2mi'], { type: 'unit' })
// Returns: ['1km', ', ', '2mi']

Foundation for Components

This functionality lays the groundwork for the upcoming <List/> component and msg.list() / gt.list() methods, which will provide React interfaces for list formatting.