Properly infer icons type #484
Conversation
| icon: object | Array<string> | string | IconDefinition | ||
| mask?: object | Array<string> | string | ||
| icon: [IconPrefix, IconName] | IconName | IconDefinition | ||
| mask?: [IconPrefix, IconName] | IconName |
There was a problem hiding this comment.
@Mensix --- Would/could this break backwards compatibility ?
There was a problem hiding this comment.
Oh, good question! I tested the change with the Nuxt framework - obviously VS Code gave autocompletion properly. Once given wrong icon name, an TS related error appears, however... it means nothing at all, as typing errors are ignored both in the dev and build mode. Seems like the case also for Vite and vue-cli according to their docs, unless using vue-tsc utility.
So 🤔, I will have a further look on it tomorrow.
There was a problem hiding this comment.
I just noticed that there is a breaking change -- string syntax wouldn't be further supported. If we try to extend types by it:
icon: [IconPrefix, IconName] | IconName | IconDefinition | [CssStyleClass, `fa-${IconName}`]
mask?: [IconPrefix, IconName] | IconName | [CssStyleClass, `fa-${IconName}`]then (at least VSC) gives lots of pointless options, like fa-duotone fa-facebook. But!
We could also totally make the string option not supported by autocompletion, yet the rest would still work, by using, well, weird TypeScript hacks: microsoft/TypeScript#29729. But there won't be any breaking changes then ;)
The library exposes IconPrefix, IconName and IconDefinition types, which can be used to improve developer experience by marking props definition with those. As the change is strictly related to TypeScript, I am not sure how to write tests for it. I hope somebody will take a look on it :)