diff --git a/README.md b/README.md index 27736cb4..b51642a9 100644 --- a/README.md +++ b/README.md @@ -406,6 +406,7 @@ export default class IframeNode extends Node { // `node` is a Prosemirror Node Object // `updateAttrs` is a function to update attributes defined in `schema` // `editable` is the global editor prop whether the content can be edited + // `selected` props: ['node', 'updateAttrs', 'editable'], computed: { src: { diff --git a/packages/tiptap/src/Utils/ComponentView.js b/packages/tiptap/src/Utils/ComponentView.js index 8f7db9f5..b8e67857 100644 --- a/packages/tiptap/src/Utils/ComponentView.js +++ b/packages/tiptap/src/Utils/ComponentView.js @@ -19,6 +19,7 @@ export default class ComponentView { this.getPos = getPos this.decorations = decorations this.editable = editable + this.selected = false this.dom = this.createDOM() this.contentDOM = this.vm.$refs.content @@ -34,6 +35,7 @@ export default class ComponentView { getPos: this.getPos, decorations: this.decorations, editable: this.editable, + selected: false, updateAttrs: attrs => this.updateAttrs(attrs), updateContent: content => this.updateContent(content), }, @@ -53,16 +55,27 @@ export default class ComponentView { this.node = node this.decorations = decorations + this.updateComponentProps({ + node, + decorations, + }) + + return true + } + + updateComponentProps(props) { // Update props in component // TODO: Avoid mutating a prop directly. // Maybe there is a better way to do this? const originalSilent = Vue.config.silent Vue.config.silent = true - this.vm._props.node = node - this.vm._props.decorations = decorations - Vue.config.silent = originalSilent - return true + Object.entries(props).forEach(([key, value]) => { + this.vm._props[key] = value + }) + // this.vm._props.node = node + // this.vm._props.decorations = decorations + Vue.config.silent = originalSilent } updateAttrs(attrs) { @@ -103,6 +116,18 @@ export default class ComponentView { return true } + selectNode() { + this.updateComponentProps({ + selected: true, + }) + } + + deselectNode() { + this.updateComponentProps({ + selected: false, + }) + } + destroy() { this.vm.$destroy() }