Vue version

3.3.8

Link to minimal reproduction

https://play.vuejs.org/#eNqFUstOwzAQ/JXFlxapNEK9VWklQJUAiYcAwcWXNN2mKY5t+VGKQv6dtUNDQTxO9s7semc9W7MTrYcbj2zMUpubUjuw6LwGkcliwpmznE25LCutjIMaDC6hgaVRFfSorNdRZ6rSLc7ZMAlReJYzLrnMlbQOKlvAJDzQ752jEAqelBGLg94hl2nS9qZOFDistMgcUgSQro6ndR2LmyZNKIpobLc5qtQCBckkmjNIiEuTrpwNSD71XpbFcG2VpBnrUMxZTtWlQHOjXUnaOBtDZAKXkbSXy4g543Gww/MV5s8/4Gu7DRhntwYtmg3N3HEuMwW6lp7dX+OW7h1J2r2g7D/IO7RK+KCxTTv1ckGy9/Ki2otoQSmLBzvbOpR2N1QQGjKbmM8ZORI+7rfRP+WOhqNYx2VDv7hz858l+bA5WPKYCY/k9gKXpcSrAKXWGZIIbyB9NUcTL0LQMVdKYCan/a+b8G0PSqm9A/eqMXSMv7W/AF3XKGV/C5p3e9v5Lg==

Steps to reproduce

Create a Component with a defineModel that got multiple types

<script setup lang="ts">
const modelValue = defineModel<string | number | null | boolean>()
</script>
<template>
  <input type="text" v-model="modelValue">
</template>

Use the component.

<script setup lang="ts">
import { ref } from 'vue'
import Comp from "./Comp.vue"

const msg = ref('Hello World!')
</script>

<template>
  <h1>{{ msg }}</h1>
  <Comp v-model="msg" />
</template>

Observe warning:

What is expected?

Expected is that the component accepts the string without any errors.

What is actually happening?

The component throws a warning that it got passed a String instead a Boolean

System Info

No response

Any additional comments?

Im now defineModel is an experimental feature , but i guess the user would expect that it works as the usual prop type definition that throws no warning.