fix(Input/InputNumber/Textarea): make modelModifiers generic

[hywax]

🔗 Linked issue

None

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

before	after

optional?: boolean - why was this left as is?
To avoid adding the undefined type to all components in the model.

Adds more typing

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[pkg-pr-new]

npm i https://pkg.pr.new/@nuxt/ui@5361

commit: 4066c63

[hywax]

@benjamincanac added screenshots with an example

[sandros94]

Oh, this is a nice one! At first glance everything seems alright, but I'll be home tomorrow evening to properly double-check

[sandros94]

I haven't been able to play with this PR yet, but something was feeling off and tested it in a typescript playground to double check it, and found what it was:

Doing a Something extends SomethingElse make typescritp check that every property of Something can extend SomethingElse, but having the : never makes the final output always truthy in the wrong way. The proper check for this use-case would be SomethingElse extends Something, to be more precise:

  nullable?: null extends T ? true : never

You can also check this typescritp playground

But for some unknown reasons to me Vue seems to break with optional (tested in a vue playground for now), while typescript says that it is a legal operation to do

[sandros94]

LGTM.

As of now I would merge it like this, then if I ever understand what causes optional to break I will either create a new PR or report upstream (if it is something related to vue-tsc or whatever). Because even in a Vue playground it seems to work just fine...

[vlaaadislav]

@sandros94 I'm not sure if it's relevant, but if you set exactOptionalPropertyTypes: true in playground/nuxt/tsconfig, then the optional modifier will work nicely. It seems that without it, undefined is excluded from the generic type since model-value is already an optional prop.

[sandros94]

@sandros94 I'm not sure if it's relevant, but if you set exactOptionalPropertyTypes: true in playground/nuxt/tsconfig, then the optional modifier will work nicely. It seems that without it, undefined is excluded from the generic type since model-value is already an optional prop.

@vlaaadislav that could explain it, which in that case I would leave it as is anyway