const title = defineModel('title', { required: true })

const emit = defineEmits<{
  foo: [id: number]
  bar: [name: string, ...rest: any[]]
}>()

const slots = defineSlots<{
  default?: (props: { msg: string }) => any
  item?: (props: { id: number }) => any
}>()

interface Emits {
  foo: [id: number]
  bar: [name: string, ...rest: any[]]
}

const emit = defineEmits<Emits>()

interface Slots {
  default?: (props: { msg: string }) => any
  item?: (props: { id: number }) => any
}

const slots = defineSlots<Slots>()

<script setup lang="ts" generic="T">
const props = defineProps<{
items: T[]
selected: T
}>()

</script>

<template>
  <div>

  </div>
</template>

<style scoped>

</style>

import type { InjectionKey } from 'vue'
import { inject, provide } from 'vue'

const store = () => {}

const storeKey: InjectionKey<ReturnType<typeof store>> = Symbol('composition-store')

export const provideStore = () => {
    const state = store()
    provide(storeKey, state)
    return state
}

export const useStore = () => {
    return inject(storeKey)!
}

interface Props {
    msg: string
}

// For default values for your props, use :
// withDefaults(defineProps<Props>(), { msg: 'myDefaultValue' })}
const props = defineProps<Props>()

interface Emits {
    (e: 'change', id: number): void
    (e: 'update', value: string): void
}

const emit = defineEmits<Emits>()

const props = defineProps(['modelValue'])
const emit = defineEmits(['update:modelValue'])

const value = computed({
    get() {
        return props.modelValue
    },
    set(value) {
        emit('update:modelValue', value)
    }
})