Watcher in Typst.vue incorrectly observes props instead of props.content, causing memory access errors

[bryarrow]

Describe the bug
The watcher in Typst.vue currently listens to changes on the entire props object:

watch(props, async (newVal, oldVal) => {
  typst.compiled = await $typst.svg({ mainContent: newVal });
});

This is incorrect and leads to memory access out-of-bounds errors when the component updates, as shown in the following error logs:

Uncaught (in promise) RuntimeError: memory access out of bounds
    at typst_ts_web_compiler_bg.wasm:0xdd68fd
    at typst_ts_web_compiler_bg.wasm:0xdcd1df
    at passStringToWasm0 (wasm-pack-shim-6I3X3JOP.js?v=da387d38:87:11)
    at _TypstCompiler.add_source (wasm-pack-shim-6I3X3JOP.js?v=da387d38:400:18)
    at _TypstCompilerDriver.addSource (chunk-V3PO3NNM.js?v=da387d38:117:19)
    at _TypstSnippet.addSource (chunk-ORACNTOV.js?v=da387d38:486:32)
    at async _TypstSnippet.getCompileOptions (chunk-ORACNTOV.js?v=da387d38:585:7)
    at async _TypstSnippet.getVector (chunk-ORACNTOV.js?v=da387d38:593:18)
    at async _TypstSnippet.transientRender (chunk-ORACNTOV.js?v=da387d38:601:18)
    at async Typst.vue:38:20

To Reproduce

1. Write a simple page like

<script setup lang="ts">
import { ref } from 'vue'
import Typst from '@myriaddreamin/typst.vue3'
const sourceCode = ref(`= Hello Typst in VUE`)
</script>

<template>
  <main>
    <textarea v-model="sourceCode"></textarea>
    <Typst :content="sourceCode" />
  </main>
</template>

2. Run it and edit code in textarea
3. See error

Expected behavior
The watcher should observe props.content specifically:

watch(() => props.content, async (newVal, oldVal) => {
  typst.compiled = await $typst.svg({ mainContent: newVal });
});

Package/Software version:

@myriaddreamin/typst.vue3:0.6.1-rc3