Hello,
Recently started using CodeMirror on a single page Svelte based project (using this component version GitHub - touchifyapp/svelte-codemirror-editor: A svelte component to create a CodeMirror 6+ editor).
My first code editor instance worked absolutely fine, displays the data I expect it to and accepts inputs to update it live.
However, for some weird reason when I add my second code editor under a different tab to call other data (from stores), it always pulls the info from the first code editor no matter what I do.
If I maully refer the data in a p e.g.
<p class="text-xs p-2 bg-muted rounded break-words whitespace-pre-wrap">
{$recipePreview}
</p>
This one loads absolutely fine, so I know its not the data itself, but the fact CodeMirror for some reason its displaying the same instance twice and not respecting the two different ones I created.
My first one is:
<CodeMirror bind:value={$manifestPreview} lang={xml()} theme={$mode === 'dark' ? vscodeDark : vscodeLight} readonly lineWrapping/>
And this is my second:
<CodeMirror bind:value={$recipePreview} lang={xml()} theme={$mode === 'dark' ? vscodeDark : vscodeLight} readonly lineWrapping/>