Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unable to use boolean values with USelectMenu or null with UInput #1710

Open
Wazbat opened this issue Apr 23, 2024 · 1 comment
Open

Unable to use boolean values with USelectMenu or null with UInput #1710

Wazbat opened this issue Apr 23, 2024 · 1 comment
Labels
bug Something isn't working

Comments

@Wazbat
Copy link

Wazbat commented Apr 23, 2024

Environment

Version

v2.14.2

Reproduction

https://stackblitz.com/edit/nuxt-ui-eqhn2j?file=app.vue

Description

I'm getting multiple new type errors that I wasn't getting before with types that used to be valid. I think this is being caused by an update to vue-tsc, however I'm not sure.

In the reproduction link you can see the two examples that don't compile. Simply run npm run typecheck in the console to get the errors
Here are the minimal examples

<script setup lang="ts">
const value = ref<string | null | undefined>(undefined);
</script>

<template>
  <div>
    <UInput v-model.trim="value" />
  </div>
</template>
TS2322: Type 'string | null | undefined' is not assignable to type 'string | number | undefined'.
<script setup lang="ts">
const value = ref<boolean|undefined>();
const options = [
  {
    label: 'Yes',
    value: true
  },
  {
    label: 'No',
    value: false
  },
  {
    label: 'None selected',
    value: undefined
  }
];
</script>
<template>
  <div>
    <USelectMenu
    :options="options"
    v-model="value"
    value-attribute="value" option-attribute="label"
    />
  </div>
</template>
TS2322: Type 'boolean | undefined' is not assignable to type 'string | number | Record<string, any> | unknown[] | undefined'.

Additional context

Logs

app.vue:14:15 - error TS2322: Type 'string | null | undefined' is not assignable to type 'string | number | undefined'.

14       <UInput v-model.trim="inputValue" />
                 ~~~~~~~~~~

  node_modules/@nuxt/ui/dist/runtime/components/forms/Input.vue.d.ts:244:5
    244     modelValue: string | number;
            ~~~~~~~~~~
    The expected type comes from property 'modelValue' which is declared here on type 'Partial<{ size: InputSize; ui: any; id: string; icon: string; color: any; type: string; class: any; name: string; modelValue: string | number; leading: boolean; variant: InputVariant; ... 12 more ...; modelModifiers: { ...; }; }> & Omit<...> & Record<...>'


Found 1 error in app.vue:14
@Wazbat Wazbat added the bug Something isn't working label Apr 23, 2024
@Wazbat
Copy link
Author

Wazbat commented Apr 23, 2024

I've also tried downgrading vue-tsc to the latest ^1.8.27 release according to the warning in https://nuxt.com/docs/guide/concepts/typescript but I still get the error. I've updated the stackblitz with the downgraded version

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant