fix(core): escape node labels (#1695)

* fix(core): escape node labels

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

* chore(changeset): add

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

---------

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
Braks
2024-11-13 20:15:25 +01:00
parent 4b8139da66
commit f7a266415a
4 changed files with 11 additions and 6 deletions

View File

@@ -0,0 +1,5 @@
---
"@vue-flow/core": patch
---
Escape node labels and avoid rendering them as innerHTML

View File

@@ -1,5 +1,5 @@
import type { Component, FunctionalComponent } from 'vue'
import { h } from 'vue'
import { Fragment, h } from 'vue'
import Handle from '../Handle/Handle.vue'
import type { NodeProps } from '../../types'
import { Position } from '../../types'
@@ -17,7 +17,7 @@ const DefaultNode: FunctionalComponent<NodeProps<{ label: any }>> = function ({
return [
h(Handle as Component, { type: 'target', position: targetPosition, connectable, isValidConnection: isValidTargetPos }),
typeof label !== 'string' && label ? h(label) : h('div', { innerHTML: label }),
typeof label !== 'string' && label ? h(label) : h(Fragment, [label]),
h(Handle as Component, { type: 'source', position: sourcePosition, connectable, isValidConnection: isValidSourcePos }),
]
}

View File

@@ -1,5 +1,5 @@
import type { Component, FunctionalComponent } from 'vue'
import { h } from 'vue'
import { Fragment, h } from 'vue'
import Handle from '../Handle/Handle.vue'
import type { NodeProps } from '../../types'
import { Position } from '../../types'
@@ -14,7 +14,7 @@ const InputNode: FunctionalComponent<NodeProps<{ label: any }>> = function ({
const label = data.label || _label
return [
typeof label !== 'string' && label ? h(label) : h('div', { innerHTML: label }),
typeof label !== 'string' && label ? h(label) : h(Fragment, [label]),
h(Handle as Component, { type: 'source', position: sourcePosition, connectable, isValidConnection: isValidSourcePos }),
]
}

View File

@@ -1,5 +1,5 @@
import type { Component, FunctionalComponent } from 'vue'
import { h } from 'vue'
import { Fragment, h } from 'vue'
import Handle from '../Handle/Handle.vue'
import type { NodeProps } from '../../types'
import { Position } from '../../types'
@@ -15,7 +15,7 @@ const OutputNode: FunctionalComponent<NodeProps<{ label: any }>> = function ({
return [
h(Handle as Component, { type: 'target', position: targetPosition, connectable, isValidConnection: isValidTargetPos }),
typeof label !== 'string' && label ? h(label) : h('div', { innerHTML: label }),
typeof label !== 'string' && label ? h(label) : h(Fragment, [label]),
]
}