Nuxt Content: How to render the markdown content?

Question

everyone. I'm a bit confused when following the documentation.

Given I have a markdown file:

 /content/article/design.md
---
title: How to design
year: 2023
---
The content of this markdown

In my /pages/article/[...slug].vue 

<template>
  <main>
    <ContentDoc>
      <template #default="{ doc }">
        <p>{{ doc.title }}</p>
        <p>{{ doc.year }}</p>
        <ContentRenderer :value="doc"/>
      </template>
    </ContentDoc>
  </main>
</template>

Problem: The title and year is rendered. But they don't return anything. Question: What component can I use to render the content from the markdown?