diff --git a/examples/example-app-router/src/i18n/request.ts b/examples/example-app-router/src/i18n/request.ts index 21fab9621..965027b89 100644 --- a/examples/example-app-router/src/i18n/request.ts +++ b/examples/example-app-router/src/i18n/request.ts @@ -1,7 +1,7 @@ import {notFound} from 'next/navigation'; +import {Formats} from 'next-intl'; import {getRequestConfig} from 'next-intl/server'; import {routing} from './routing'; -import { Formats } from 'next-intl'; export const formats = { dateTime: { @@ -22,8 +22,7 @@ export const formats = { type: 'conjunction' } } -} as const satisfies Partial - +} as const satisfies Partial; export default getRequestConfig(async ({locale}) => { // Validate that the incoming `locale` parameter is valid @@ -37,5 +36,5 @@ export default getRequestConfig(async ({locale}) => { : import(`../../messages/${locale}.json`)) ).default, formats - } + }; }); diff --git a/packages/use-intl/src/core/createFormatter.tsx b/packages/use-intl/src/core/createFormatter.tsx index 78045fa96..9d3325f9c 100644 --- a/packages/use-intl/src/core/createFormatter.tsx +++ b/packages/use-intl/src/core/createFormatter.tsx @@ -163,7 +163,11 @@ export default function createFormatter({ value: Date | number, /** If a time zone is supplied, the `value` is converted to that time zone. * Otherwise the user time zone will be used. */ - formatOrOptions?: keyof IntlFormats['dateTime'] | DateTimeFormatOptions + formatOrOptions?: + | (keyof IntlFormats['dateTime'] extends string + ? IntlFormats['dateTime'] + : string) + | DateTimeFormatOptions ) { return getFormattedValue( formatOrOptions, @@ -183,7 +187,11 @@ export default function createFormatter({ end: Date | number, /** If a time zone is supplied, the values are converted to that time zone. * Otherwise the user time zone will be used. */ - formatOrOptions?: keyof IntlFormats['dateTime'] | DateTimeFormatOptions + formatOrOptions?: + | (keyof IntlFormats['dateTime'] extends string + ? IntlFormats['dateTime'] + : string) + | DateTimeFormatOptions ) { return getFormattedValue( formatOrOptions, @@ -200,7 +208,11 @@ export default function createFormatter({ function number( value: number | bigint, - formatOrOptions?: keyof IntlFormats['number'] | NumberFormatOptions + formatOrOptions?: + | (keyof IntlFormats['number'] extends string + ? IntlFormats['number'] + : string) + | NumberFormatOptions ) { return getFormattedValue( formatOrOptions, @@ -284,7 +296,11 @@ export default function createFormatter({ type FormattableListValue = string | ReactElement; function list( value: Iterable, - formatOrOptions?: IntlFormats['list'] | Intl.ListFormatOptions + formatOrOptions?: + | (keyof IntlFormats['list'] extends string + ? IntlFormats['list'] + : string) + | Intl.ListFormatOptions ): Value extends string ? string : Iterable { const serializedValue: Array = []; const richValues = new Map(); diff --git a/packages/use-intl/src/react/useFormatter.test.tsx b/packages/use-intl/src/react/useFormatter.test.tsx index 16bc0664b..88b1124d4 100644 --- a/packages/use-intl/src/react/useFormatter.test.tsx +++ b/packages/use-intl/src/react/useFormatter.test.tsx @@ -67,7 +67,6 @@ describe('dateTime', () => { it('can use a global date format', () => { function Component() { const format = useFormatter(); - // @ts-expect-error return <>{format.dateTime(mockDate, 'onlyYear')}; } @@ -83,7 +82,6 @@ describe('dateTime', () => { it('can use a global time format', () => { function Component() { const format = useFormatter(); - // @ts-expect-error return <>{format.dateTime(mockDate, 'onlyHours')}; } @@ -193,7 +191,6 @@ describe('dateTime', () => { function Component() { const format = useFormatter(); - // @ts-expect-error return <>{format.dateTime(mockDate, 'onlyYear')}; } @@ -221,7 +218,6 @@ describe('dateTime', () => { function Component() { const format = useFormatter(); - // @ts-expect-error return <>{format.dateTime(mockDate, 'medium')}; } @@ -319,7 +315,6 @@ describe('number', () => { it('can use a global format', () => { function Component() { const format = useFormatter(); - // @ts-expect-error return <>{format.number(10000, 'noGrouping')}; } @@ -375,7 +370,6 @@ describe('number', () => { function Component() { const format = useFormatter(); - // @ts-expect-error return <>{format.number(mockNumber, 'missing')}; } diff --git a/packages/use-intl/types/index.d.ts b/packages/use-intl/types/index.d.ts index 792fe83c0..d21023b4e 100644 --- a/packages/use-intl/types/index.d.ts +++ b/packages/use-intl/types/index.d.ts @@ -5,9 +5,9 @@ declare interface IntlMessages extends Record {} // This type is intended to be overridden // by the consumer for optional type safety of formats declare interface IntlFormats { - dateTime: {}; - number: {}; - list: {}; + dateTime: any; + number: any; + list: any; } // Temporarly copied here until the "es2020.intl" lib is published.