Skip to content

Commit

Permalink
Add Vue augmentation to type global mixin properties
Browse files Browse the repository at this point in the history
  • Loading branch information
brawaru committed Oct 30, 2023
1 parent 21945e4 commit 985b5a0
Show file tree
Hide file tree
Showing 5 changed files with 54 additions and 15 deletions.
19 changes: 19 additions & 0 deletions .changeset/cool-trains-roll.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
---
'@vintl/vintl': minor
---

Added Vue types augmentation to type the global mixin properties

Mixin-provided global properties like `$t`, `$fmt` and `$i18n` should be properly typed now.

If you don't use the global mixin, the below augmentation will remove these unusable properties.

```ts
declare global {
namespace VueIntlController {
interface Options {
globalMixin: false
}
}
}
```
12 changes: 12 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -374,6 +374,14 @@ You can declare your messages by creating an ambient declaration file where you

A map of locale resources provided by the load event listeners.

- `interface` `Options`

A map of options affecting type augmentation.

Currently supported options:

- `globalMixin` (`boolean`, default `true`) - whether to augment Vue types to type mixin-provided global properties.

<details>
<summary>Example</summary>

Expand All @@ -394,6 +402,10 @@ import type { ExampleObject } from '~/utils/convertibleObject.ts'

declare global {
namespace VueIntlController {
interface Options {
globalMixin: false // Remove types for mixin-provided properties.
}

interface MessageValueTypes {
// key doesn't matter as long as it does not collide with other key;
// the interface used here solely for extensibility since you cannot
Expand Down
1 change: 1 addition & 0 deletions src/types/index.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import './vue-augment.js'
export * from './messages.js'
export * from './locales.js'
export * from './sources.js'
Expand Down
22 changes: 22 additions & 0 deletions src/types/vue-augment.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import type { InjectedProperties } from '../plugin.js'
import type { MessageValueType } from './messages.js'

declare global {
namespace VueIntlController {
interface Options {}
}
}

type ConditionalExtensions = VueIntlController.Options extends {
globalMixin: infer GlobalMixin
}
? [GlobalMixin] extends [true]
? InjectedProperties<MessageValueType>
: {}
: InjectedProperties<MessageValueType>

declare module 'vue' {
export interface ComponentCustomProperties extends ConditionalExtensions {}
}

export {}
15 changes: 0 additions & 15 deletions typings/globals.d.ts

This file was deleted.

0 comments on commit 985b5a0

Please sign in to comment.