# ComponentContent

Learn how to type component content in your Vue application.

This type resolves the content type for a versioned [Component](/explanation/component) ID.

## Signature

This type has the following signature:

```ts
type ComponentContent<I extends VersionedComponentId>
```

## Usage

Pass a versioned component ID like `'banner@1'` to get the corresponding content type:

```vue
<script setup lang="ts">
import type {ComponentContent} from '@croct/plug-vue'

type BannerProps = ComponentContent<'banner@1'>

const props = defineProps<BannerProps>()
</script>

<template>
  <div>
      <h2>{{ props.title }}</h2>
      <p>{{ props.subtitle }}</p>
  </div>
</template>
```

When using [CLI-generated types](/reference/cli/type-generation), the type parameter is constrained to known component IDs, providing autocompletion and type safety.