feat(useLocale): change t() to variadic signature

johnleider · johnleider · commit 245182f040f0 · 2026-03-20T22:40:54.000-05:00
Align t() with Vuetify's `t(key, ...params)` convention,
dropping the explicit fallback parameter. This enables
direct adapter compatibility when Vuetify migrates to v0's
useLocale under the hood.

BREAKING CHANGE: t() signature changed from
t(key, params?, fallback?) to t(key, ...params).
Consumers using the fallback parameter should use the
fallback locale mechanism or provide default messages.
diff --git a/packages/0/src/components/Breadcrumbs/BreadcrumbsRoot.vue b/packages/0/src/components/Breadcrumbs/BreadcrumbsRoot.vue
@@ -253,7 +253,7 @@
     prev: breadcrumbs.prev,
     select: breadcrumbs.select,
     attrs: {
-      'aria-label': label ?? locale.t('Breadcrumbs.label', undefined, 'Breadcrumb'),
+      'aria-label': label ?? locale.t('Breadcrumbs.label'),
       'role': as === 'nav' ? undefined : 'navigation',
     },
   }))
diff --git a/packages/0/src/components/Breadcrumbs/index.test.ts b/packages/0/src/components/Breadcrumbs/index.test.ts
@@ -62,14 +62,14 @@ describe('breadcrumbs', () => {
     })
 
     describe('accessibility', () => {
-      it('should have aria-label="Breadcrumb"', () => {
+      it('should have aria-label from locale key', () => {
         const wrapper = mount(Breadcrumbs.Root, {
           slots: {
             default: () => h('div', 'Content'),
           },
         })
 
-        expect(wrapper.find('nav').attributes('aria-label')).toBe('Breadcrumb')
+        expect(wrapper.find('nav').attributes('aria-label')).toBe('Breadcrumbs.label')
       })
 
       it('should not have role="navigation" when as="nav"', () => {
@@ -530,7 +530,7 @@ describe('breadcrumbs', () => {
       expect(wrapper.find('nav').exists()).toBe(true)
       expect(wrapper.find('ol').exists()).toBe(true)
       expect(wrapper.findAll('li').length).toBeGreaterThan(0)
-      expect(wrapper.find('[aria-label="Breadcrumb"]').exists()).toBe(true)
+      expect(wrapper.find('[aria-label="Breadcrumbs.label"]').exists()).toBe(true)
       expect(wrapper.find('[role="list"]').exists()).toBe(true)
     })
 
@@ -907,7 +907,7 @@ describe('breadcrumbs', () => {
       expect(html).toBeTruthy()
       expect(html).toContain('Home')
       expect(html).toContain('Current')
-      expect(html).toContain('aria-label="Breadcrumb"')
+      expect(html).toContain('aria-label="Breadcrumbs.label"')
       expect(html).toContain('role="list"')
       expect(html).toContain('aria-current="page"')
     })
diff --git a/packages/0/src/components/Pagination/PaginationFirst.vue b/packages/0/src/components/Pagination/PaginationFirst.vue
@@ -87,7 +87,7 @@
     isDisabled: isDisabled.value,
     first,
     attrs: {
-      'aria-label': locale.t('Pagination.first', undefined, 'Go to first page'),
+      'aria-label': locale.t('Pagination.first'),
       'aria-disabled': isDisabled.value,
       'data-disabled': isDisabled.value || undefined,
       'disabled': as === 'button' ? isDisabled.value : undefined,
diff --git a/packages/0/src/components/Pagination/PaginationItem.vue b/packages/0/src/components/Pagination/PaginationItem.vue
@@ -89,8 +89,8 @@
 
   const ariaLabel = toRef(() => {
     return isSelected.value
-      ? locale.t('Pagination.currentPage', { page: value }, `Page ${value}, current page`)
-      : locale.t('Pagination.goToPage', { page: value }, `Go to page ${value}`)
+      ? locale.t('Pagination.currentPage', { page: value })
+      : locale.t('Pagination.goToPage', { page: value })
   })
 
   function select () {
diff --git a/packages/0/src/components/Pagination/PaginationLast.vue b/packages/0/src/components/Pagination/PaginationLast.vue
@@ -87,7 +87,7 @@
     isDisabled: isDisabled.value,
     last,
     attrs: {
-      'aria-label': locale.t('Pagination.last', undefined, 'Go to last page'),
+      'aria-label': locale.t('Pagination.last'),
       'aria-disabled': isDisabled.value,
       'data-disabled': isDisabled.value || undefined,
       'disabled': as === 'button' ? isDisabled.value : undefined,
diff --git a/packages/0/src/components/Pagination/PaginationNext.vue b/packages/0/src/components/Pagination/PaginationNext.vue
@@ -87,7 +87,7 @@
     isDisabled: isDisabled.value,
     next,
     attrs: {
-      'aria-label': locale.t('Pagination.next', undefined, 'Go to next page'),
+      'aria-label': locale.t('Pagination.next'),
       'aria-disabled': isDisabled.value,
       'data-disabled': isDisabled.value || undefined,
       'disabled': as === 'button' ? isDisabled.value : undefined,
diff --git a/packages/0/src/components/Pagination/PaginationPrev.vue b/packages/0/src/components/Pagination/PaginationPrev.vue
@@ -87,7 +87,7 @@
     isDisabled: isDisabled.value,
     prev,
     attrs: {
-      'aria-label': locale.t('Pagination.prev', undefined, 'Go to previous page'),
+      'aria-label': locale.t('Pagination.prev'),
       'aria-disabled': isDisabled.value,
       'data-disabled': isDisabled.value || undefined,
       'disabled': as === 'button' ? isDisabled.value : undefined,
diff --git a/packages/0/src/components/Pagination/PaginationRoot.vue b/packages/0/src/components/Pagination/PaginationRoot.vue
@@ -201,7 +201,7 @@
     prev: pagination.prev,
     select: pagination.select,
     attrs: {
-      'aria-label': locale.t('Pagination.label', undefined, 'Pagination'),
+      'aria-label': locale.t('Pagination.label'),
       'role': as === 'nav' ? undefined : 'navigation',
     },
   }))
diff --git a/packages/0/src/components/Pagination/PaginationStatus.vue b/packages/0/src/components/Pagination/PaginationStatus.vue
@@ -82,7 +82,6 @@
       text.value = locale.t(
         'Pagination.status',
         { page, pages: pagination.pages },
-        `Page ${page} of ${pagination.pages}`,
       )
     }, 100)
   })
diff --git a/packages/0/src/components/Pagination/index.test.ts b/packages/0/src/components/Pagination/index.test.ts
@@ -783,7 +783,7 @@ describe('pagination', () => {
       vi.advanceTimersByTime(100)
       await nextTick()
 
-      expect(statusProps.text).toContain('2')
+      expect(statusProps.text).toBe('Pagination.status')
 
       vi.useRealTimers()
     })
diff --git a/packages/0/src/composables/useLocale/adapters/adapter.ts b/packages/0/src/composables/useLocale/adapters/adapter.ts
@@ -11,6 +11,6 @@ export interface LocaleAdapterContext {
 }
 
 export interface LocaleAdapter {
-  t: (key: string, params?: Record<string, unknown> | unknown[], fallback?: string) => string
+  t: (key: string, ...params: unknown[]) => string
   n: (value: number) => string
 }
diff --git a/packages/0/src/composables/useLocale/adapters/v0.ts b/packages/0/src/composables/useLocale/adapters/v0.ts
@@ -4,9 +4,6 @@ import { IN_BROWSER } from '#v0/constants/globals'
 // Utilities
 import { isObject, isString, isUndefined } from '#v0/utilities'
 
-// Transformers
-import { toArray } from '#v0/composables/toArray'
-
 // Types
 import type { ID } from '#v0/types'
 import type { LocaleAdapter, LocaleAdapterContext } from './adapter'
@@ -24,26 +21,25 @@ export class Vuetify0LocaleAdapter implements LocaleAdapter {
     this.context = context
   }
 
-  t (key: string, params?: Record<string, unknown> | unknown[], fallback?: string): string {
+  t (key: string, ...params: unknown[]): string {
     const locale = this.context.selectedId.value
-    const args = toArray(params)
 
-    if (!locale) return this.interpolate(fallback ?? key, args)
+    if (!locale) return this.interpolate(key, params)
 
     const message = this.context.tokens.get(`${locale}.${key}`)?.value
 
     if (isString(message)) {
-      return this.interpolate(this.resolve(locale, message), args)
+      return this.interpolate(this.resolve(locale, message), params)
     }
 
     if (this.context.fallbackLocale) {
       const fbMessage = this.context.tokens.get(`${this.context.fallbackLocale}.${key}`)?.value
       if (isString(fbMessage)) {
-        return this.interpolate(this.resolve(this.context.fallbackLocale, fbMessage), args)
+        return this.interpolate(this.resolve(this.context.fallbackLocale, fbMessage), params)
       }
     }
 
-    return this.interpolate(fallback ?? key, args)
+    return this.interpolate(key, params)
   }
 
   n (value: number): string {
diff --git a/packages/0/src/composables/useLocale/adapters/vue-i18n/index.ts b/packages/0/src/composables/useLocale/adapters/vue-i18n/index.ts
@@ -1,5 +1,5 @@
 // Utilities
-import { isArray } from '#v0/utilities'
+import { isObject } from '#v0/utilities'
 
 // Types
 import type { LocaleAdapter } from '../adapter'
@@ -20,12 +20,14 @@ export class VueI18nLocaleAdapter implements LocaleAdapter {
     this.composer = i18n.global
   }
 
-  t (key: string, params?: Record<string, unknown> | unknown[], fallback?: string): string {
-    if (fallback && !this.composer.te(key)) return fallback
+  t (key: string, ...params: unknown[]): string {
+    if (params.length > 0 && isObject(params[0])) {
+      return this.composer.t(key, params[0] as Record<string, unknown>)
+    }
 
-    return isArray(params)
-      ? this.composer.t(key, params as unknown[])
-      : this.composer.t(key, params ?? {})
+    return params.length > 0
+      ? this.composer.t(key, params)
+      : this.composer.t(key)
   }
 
   n (value: number): string {
diff --git a/packages/0/src/composables/useLocale/index.test.ts b/packages/0/src/composables/useLocale/index.test.ts
@@ -90,33 +90,7 @@ describe('useLocale', () => {
       expect(locale.t('missing')).toBe('missing')
     })
 
-    it('should use fallback when translation not found', () => {
-      const locale = createLocale({
-        default: 'en',
-        messages: {
-          en: { hello: 'Hello' },
-        },
-      })
-
-      expect(locale.t('missing.key', { page: 5 }, 'Go to page 5')).toBe('Go to page 5')
-    })
-
-    it('should use translation over fallback when found', () => {
-      const locale = createLocale({
-        default: 'en',
-        messages: {
-          en: {
-            Pagination: {
-              goToPage: 'Navigate to page {page}',
-            },
-          },
-        },
-      })
-
-      expect(locale.t('Pagination.goToPage', { page: 5 }, 'Go to page 5')).toBe('Navigate to page 5')
-    })
-
-    it('should support nested message structures', () => {
+    it('should translate nested message structures', () => {
       const locale = createLocale({
         default: 'en',
         messages: {
@@ -129,8 +103,8 @@ describe('useLocale', () => {
         },
       })
 
-      expect(locale.t('Pagination.goToPage', { page: 5 }, 'Go to page 5')).toBe('Navigate to page 5')
-      expect(locale.t('Pagination.currentPage', { page: 3 }, 'Page 3')).toBe('Page 3, current')
+      expect(locale.t('Pagination.goToPage', { page: 5 })).toBe('Navigate to page 5')
+      expect(locale.t('Pagination.currentPage', { page: 3 })).toBe('Page 3, current')
     })
 
     it('should switch locale and translate accordingly', () => {
@@ -192,11 +166,6 @@ describe('useLocale', () => {
       expect(locale.t('hello')).toBe('hello')
     })
 
-    it('should use fallback when no locale is selected', () => {
-      const locale = createLocale({ messages: { en: { hello: 'Hello' } } })
-      expect(locale.t('hello', {}, 'Fallback text')).toBe('Fallback text')
-    })
-
     it('should interpolate params when no locale is selected', () => {
       const locale = createLocale({ messages: { en: { hello: 'Hello' } } })
       expect(locale.t('Hello {name}', { name: 'World' })).toBe('Hello World')
@@ -265,19 +234,14 @@ describe('useLocale', () => {
 
     it('should handle numbered placeholders', () => {
       const adapter = createAdapter({ en: { sum: 'Sum: {0} + {1} = {2}' } }, 'en')
-      expect(adapter.t('sum', [1, 2, 3])).toBe('Sum: 1 + 2 = 3')
+      expect(adapter.t('sum', 1, 2, 3)).toBe('Sum: 1 + 2 = 3')
     })
 
     it('should return key when translation not found', () => {
       const adapter = createAdapter({ en: { hello: 'Hello' } }, 'en')
       expect(adapter.t('missing')).toBe('missing')
     })
 
-    it('should return fallback when translation not found', () => {
-      const adapter = createAdapter({ en: { hello: 'Hello' } }, 'en')
-      expect(adapter.t('missing', undefined, 'Fallback')).toBe('Fallback')
-    })
-
     it('should format numbers', () => {
       const adapter = createAdapter({ 'en-US': {} }, 'en-US')
       const result = adapter.n(1234.56)
diff --git a/packages/0/src/composables/useLocale/index.ts b/packages/0/src/composables/useLocale/index.ts
@@ -52,28 +52,25 @@ export interface LocaleContext<
   E extends LocaleTicket<Z> = LocaleTicket<Z>,
 > extends Omit<SingleContext<Z, E>, 'register'> {
   /**
-   * Translate a message key with optional parameters and fallback.
+   * Translate a message key with optional parameters.
    *
    * @param key - The message key to look up
-   * @param params - Optional object with named parameters for interpolation
-   * @param fallback - Optional fallback string if key not found in messages
+   * @param params - Optional named params object, followed by positional params
    * @returns The translated and interpolated message
    *
    * @example
    * ```ts
    * // Simple key lookup
    * locale.t('hello') // Returns message for 'hello' or 'hello' if not found
    *
-   * // With parameters
+   * // With named parameters
    * locale.t('greeting', { name: 'World' }) // 'Hello {name}' → 'Hello World'
    *
-   * // With fallback (useful for dynamic keys)
-   * locale.t('Pagination.goToPage', { page: 5 }, `Go to page 5`)
-   * // If 'pagination.goToPage' exists: uses that message with {page} replaced
-   * // If not found: returns 'Go to page 5'
+   * // With positional parameters
+   * locale.t('sum', 1, 2, 3) // 'Sum: {0} + {1} = {2}' → 'Sum: 1 + 2 = 3'
    * ```
    */
-  t: (key: string, params?: Record<string, unknown> | unknown[], fallback?: string) => string
+  t: (key: string, ...params: unknown[]) => string
   n: (value: number) => string
   /** Register a locale (accepts input type, returns output type) */
   register: (registration?: Partial<Z>) => E
@@ -125,12 +122,8 @@ export function createLocale<
     has: id => registry.has(id),
   })
 
-  function t (
-    key: string,
-    params?: Record<string, unknown> | unknown[],
-    fallback?: string,
-  ): string {
-    return adapter.t(key, params, fallback)
+  function t (key: string, ...params: unknown[]): string {
+    return adapter.t(key, ...params)
   }
 
   function n (value: number): string {
@@ -154,11 +147,7 @@ export function createLocaleFallback<
 > (): R {
   return {
     size: 0,
-    t: (
-      key: string,
-      _params?: Record<string, unknown> | unknown[],
-      fallback?: string,
-    ) => fallback ?? key,
+    t: (key: string) => key,
     n: String,
   } as unknown as R
 }

Original file line number	Diff line number	Diff line change
`@@ -82,7 +82,6 @@`
`82`	`82`	`text.value = locale.t(`
`83`	`83`	`'Pagination.status',`
`84`	`84`	`{ page, pages: pagination.pages },`
`85`		- `Page ${page} of ${pagination.pages}`,
`86`	`85`	`)`
`87`	`86`	`}, 100)`
`88`	`87`	`})`