use-list-format

Join strings into a locale-aware list with Intl.ListFormat ("a, b, and c", "a、b、c", "a, b or c").


Package	`@vizejs/composable/use-list-format`
Own the source	`vize lib pull composable:use-list-format`
Runtime exports	`useListFormat`
Gzip budget	2048 B

Usage

import { useListFormat } from "@vizejs/composable/use-list-format";

Runtime contract

Utility	Category	Stability	SSR	Hydration	Cleanup	Targets	Host globals	Uses
`useListFormat`	i18n	experimental	deterministic-fallback	caller-managed	none	web, server, worker, native, desktop, terminal	`Intl`, `window`	`useLocale`

API

`useListFormat`

Join strings into a locale-aware list with Intl.ListFormat ("a, b, and c", "a、b、c", "a, b or c"). Follows reactive items and options; formatters are cached per locale and option set through useLocale. Invalid options surface as the platform's RangeError. No listeners or timers are created.

function useListFormat( items: MaybeRefOrGetter<readonly string[]>, options: MaybeRefOrGetter<UseListFormatOptions> = {}, ): ListFormatControls

const { formatted } = useListFormat(names, { locale: "en", type: "disjunction" });

Types

`UseListFormatOptions`

Options for useListFormat.

Member	Type	Description
`locale`?	`string \| Intl.Locale`	Locale used for formatting. Pass it explicitly for hydration-stable server rendering.

`ListFormatControls`

Reactive list formatting returned by useListFormat.

Member	Type	Description
`locale`	`ComputedRef<string>`	Canonical locale in use.
`formatter`	`ComputedRef<Intl.ListFormat>`	Cached formatter for the current locale and options.
`formatted`	`ComputedRef<string>`	Formatted list, for example `"apples, pears, and plums"`.
`format`	`(items: Iterable<string>) => string`	Format any list with the current formatter.
`formatToParts`	`( items: Iterable<string>, ) => { type: "element" \| "literal"; value: string }[]`	Format any list into element and literal parts (for rich rendering).