Implement DOMWidget for vue (#6006)

![vue-dom-widget](https://github.com/user-attachments/assets/d0c0e5f6-bacb-4fd9-957e-4f19e8071c3d)

Did testing on about a dozen custom nodes. Most just work.
- Some custom nodes have copy/pasted the `addDOMWidget` call with types
like `customtext` and get converted to textareas -> Not feasible to fix
here. Can open PRs into custom nodes if complaints arise.
- Only the KJNodes spline editor had mouse issues -> Can
investigate/open PR into KJNodes later.
- Many nodes don't resize gracefully. Probably best handled in a future
PR.
- Some expect to be handled like textareas. These currently have minsize
and don't scale.
- Others, like VHS previews, scale self properly, but don't update
height inside a drag operation -> node height can be set to less than
fit.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6006-Implement-DOMWidget-for-vue-2886d73d3650817ca497c15d87d70f4f)
by [Unito](https://www.unito.io)

src/renderer/extensions/vueNodes/widgets/components/WidgetDOM.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+
+import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { isDOMWidget } from '@/scripts/domWidget'
+import type { SimplifiedWidget } from '@/types/simplifiedWidget'
+
+// Button widgets don't have a v-model value, they trigger actions
+const props = defineProps<{
+  widget: SimplifiedWidget<void>
+  nodeId: string
+  readonly?: boolean
+}>()
+
+const domEl = ref<HTMLElement>()
+
+const { canvas } = useCanvasStore()
+onMounted(() => {
+  if (!domEl.value) return
+  const node = canvas?.graph?.getNodeById(props.nodeId) ?? undefined
+  if (!node) return
+  const widget = node.widgets?.find((w) => w.name === props.widget.name)
+  if (!widget || !isDOMWidget(widget)) return
+  domEl.value.replaceChildren(widget.element)
+})
+</script>
+<template>
+  <div ref="domEl" />
+</template>