bug: Vue output modelValue is required

[markbrockhoff]

Hello,

I noticed that the generated types for Vue always require the property v-model to be defined.
This becomes especially noticeable when using tools like vue-tsc or volar for typechecking a vue project.

From my understanding, this comes from the interface InputProps defined in the generated file vue-component-lib/utils.ts.
Simply making the property modelValue optional seemed to fix the problem in my testing.

export interface InputProps extends Object {
  modelValue?: string | boolean;
}

I already created a small PR to implement the suggested fix: #234

[sean-perkins]

Hello @markbrockhoff thanks for the issue and the PR! I agree that the type is too strict and should be optional in this case.

Would you be able to create a simple reproduction app with one of the problematic dependencies that conflicts with the types? This will help in my ability to confirm your PR resolves the problem correctly and can help improve the review/merge time.

Thanks!

[markbrockhoff]

Hi @sean-perkins thanks for the quick response.
Sure, I created a small demo repo containing the stencil-component-starter, the vue-output-target and a simple vue 3 app showing the problem: https://github.com/markbrockhoff/stencil-component-starter
There's a small readme and a demo bash script that sets everything up for you and reproduces the error. Im using vue-tsc to check the types of the vue components when building the vue app. It's that step where the required property gets noticeable.

[sean-perkins]

Thanks @markbrockhoff! I'll try to clone and validate this weekend, Monday at the latest.

[markbrockhoff]

@sean-perkins Do you know when this fix will be released? It'd be great if we could install and use the new version as soon as possible.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of the output targets, please create a new issue and ensure the template is fully filled out.