From acdc004b41bca8678adea91a435c197cb7f452f7 Mon Sep 17 00:00:00 2001
From: Maxime Pauvert <maximepvrt@gmail.com>
Date: Mon, 2 Oct 2023 11:28:40 +0200
Subject: [PATCH 1/3] docs: add data pops in ContentRendererMarkdown

---
 docs/content/4.components/2.content-renderer.md | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/docs/content/4.components/2.content-renderer.md b/docs/content/4.components/2.content-renderer.md
index 0ab2bcc06..d935a4642 100644
--- a/docs/content/4.components/2.content-renderer.md
+++ b/docs/content/4.components/2.content-renderer.md
@@ -23,6 +23,9 @@ Other types will currently be passed to default slot via `v-slot="{ data }"` or
 - `components`: The map of custom components to use for rendering. This prop will pass to markdown renderer and will not affect other file types.
   - Type: `object`
   - Default: `{}`
+- `data`: A map of variables to inject into the markdown content for later use in binding variables.
+  - Type: `object`
+  - Default: `{}`
 
 ## Slots
 

From 6f1d8ad2c2fe185efe7a3fa701580e5656da48b5 Mon Sep 17 00:00:00 2001
From: Maxime Pauvert <maximepvrt@gmail.com>
Date: Mon, 2 Oct 2023 11:42:04 +0200
Subject: [PATCH 2/3] docs: add variables binding

---
 docs/content/2.usage/2.markdown.md | 39 ++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/docs/content/2.usage/2.markdown.md b/docs/content/2.usage/2.markdown.md
index 63e82864a..0c1c500be 100755
--- a/docs/content/2.usage/2.markdown.md
+++ b/docs/content/2.usage/2.markdown.md
@@ -458,6 +458,45 @@ In addition to mdc components and `span`, attribute syntax will work on images,
   ::
 ::
 
+## Binding Data in Markdown
+
+You can bind data within your Markdown document using the `{{ $doc.variable }}` syntax. These values can be defined in the YAML front matter at the top of the document, within each MDC component, or injected using the `data` prop of the `<ContentRendererMarkdown>` component.
+
+### Example 1: Define in YAML
+
+```md
+---
+title: 'Title of the page'
+description: 'meta description of the page'
+customVariable: 'Custom Value'
+---
+
+# The Title is {{ $doc.title }} and customVariable is {{ $doc.customVariable}}
+
+```
+
+### Example 2: Define in external with `<ContentRendererMarkdown>` 
+
+```html
+<template>
+  <div>
+    <ContentRendererMarkdown :value="data" :data="mdcVars"/>
+    <button type="button" v-on:click="mdcVars.name = 'Hugo'">Change name</button>
+  </div>
+</template>
+
+<script setup lang="ts">
+const { data } = await useAsyncData(() => queryContent('test').findOne());
+const mdcVars = ref({ name: 'Maxime'});
+</script>
+```
+
+```md
+
+# Hello {{ $doc.name }}
+
+```
+
 ## Prose Components
 
 In Nuxt Content, the prose represents HTML tags generated by the Markdown syntax, such as title levels and links.

From e7de2770a20dc0c75345ba93886f643b4f0a6cad Mon Sep 17 00:00:00 2001
From: Farnabaz <farnabaz@gmail.com>
Date: Mon, 9 Oct 2023 14:44:00 +0200
Subject: [PATCH 3/3] Update docs/content/2.usage/2.markdown.md

---
 docs/content/2.usage/2.markdown.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/content/2.usage/2.markdown.md b/docs/content/2.usage/2.markdown.md
index 0c1c500be..50fe980d0 100755
--- a/docs/content/2.usage/2.markdown.md
+++ b/docs/content/2.usage/2.markdown.md
@@ -471,7 +471,7 @@ description: 'meta description of the page'
 customVariable: 'Custom Value'
 ---
 
-# The Title is {{ $doc.title }} and customVariable is {{ $doc.customVariable}}
+# The Title is {{ $doc.title }} and customVariable is {{ $doc.customVariable }}
 
 ```