Bug: Cursor misalignment caused by extra whitespace in CodeEditor.vue

[Maribbit]

Description

When I import CodeEditor to my VitePress project, I noticed a visual issue where the cursor position in the textarea does not perfectly align with the highlighted code in the background. This vertical offset makes it difficult to edit code precisely.

Root Cause

After investigating the source code, I found that there is an extra newline character (whitespace) between the <pre> tag and the <code> tag in CodeEditor.vue.

In CodeEditor.vue:

<!-- Current -->
<pre>
  <code>
  </code>
</pre>

<!-- Should be -->
<pre><code></code></pre>

This whitespace causes the browser to render an extra text node or spacing inside the pre block, pushing the highlighted code down relative to the textarea.

Proposed Solution

Removing the newline between the tags fixes the alignment issue completely.

I have prepared a fix and will submit a Pull Request shortly.