Skip to content

Instantly share code, notes, and snippets.

@Ayc0
Created March 18, 2021 10:29
Show Gist options
  • Save Ayc0/1f42fc859561567a8a3e000da2425767 to your computer and use it in GitHub Desktop.
Save Ayc0/1f42fc859561567a8a3e000da2425767 to your computer and use it in GitHub Desktop.
Add types for Intl.ListFormat
// Intl.ListFormat is in stage 3, so TS doesn't include it
declare namespace Intl {
interface ListFormatOptions {
/** The locale matching algorithm to use. Possible values are `lookup` and `best fit`; the default is `best fit`. For information about this option, see the [Intl](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locale_negotiation) page. */
localeMatcher?: 'lookup' | 'best fit';
/** The format of output message. Possible values are `conjunction` that stands for `and`-based lists (default, e.g., `A, B, and C`), or `disjunction` that stands for `or`-based lists (e.g., `A, B, or C`). `unit` stands for lists of values with units (e.g., `5 pounds, 12 ounces`). */
type?: 'conjunction' | 'disjunction' | 'unit';
/** The length of the formatted message. Possible values are: `long` (default, e.g., `A, B, and C`); `short` (e.g., `A, B, C`), or `narrow` (e.g., `A B C`). When style is `short` or `narrow`, `unit` is the only allowed value for the type option. */
style?: 'long' | 'narrow' | 'short';
}
interface FormatParts {
type: 'element' | 'literal';
value: string;
}
/**
* The **`Intl.ListFormat()`** constructor creates [`Intl.ListFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/ListFormat) objects that enable language-sensitive list formatting.
*
* ``` js
* const vehicles = ['Motorcycle', 'Bus', 'Car'];
*
* const formatter = new Intl.ListFormat('en', { style: 'long', type: 'conjunction' });
* console.log(formatter.format(vehicles)); // expected output: "Motorcycle, Bus, and Car"
* const formatter2 = new Intl.ListFormat('de', { style: 'short', type: 'disjunction' });
* console.log(formatter2.format(vehicles)); // expected output: "Motorcycle, Bus oder Car"
* const formatter3 = new Intl.ListFormat('en', { style: 'narrow', type: 'unit' });
* console.log(formatter3.format(vehicles)); // expected output: "Motorcycle Bus Car"
*```
*/
interface ListFormat {
format(items: string[]): string;
formatToParts(items: string[]): FormatParts[];
}
// Not defined in IE nor in Safari
const ListFormat:
| undefined
| {
new (
locales?: string | string[],
options?: ListFormatOptions
): ListFormat;
supportedLocalesOf(
locales: string | string[],
options?: Pick<ListFormatOptions, 'localeMatcher'>
): string[];
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment