How to get the component type in <script setup>?

Question

This code comes from the official documentation and does not use defineComponent() to declare components. I tried and failed, and webstorm failed.

//App.vue
<script setup lang="ts">
import {RouterLink, RouterView} from 'vue-router'
import HelloWorld from '@/components/HelloWorld.vue'
import MyModal from '@/views/MyModal.vue' // error: This import is never used as a value and must use 'import type' because 'importsNotUsedAsValues' is set to 'error'.
import { ref,nextTick } from 'vue'


const modal1= ref(null)
const modal2 = ref<InstanceType<typeof MyModal> | null>(null)
const childOpen=()=>{
    modal1.value.open()  // it's working
    modal2.value?.open() // not working
}
</script>

//MyModal.vue
<script setup lang="ts">
import { ref } from 'vue'
const isContentShown = ref(false)
const open = () => {
    console.log(2131)
    isContentShown.value = !isContentShown.value
}
defineExpose({
    open:open
})
</script>