WysiwygEditor Extension

Thanks to the WysiwygEditor extension, you can create text sections editable with the WYSIWYG editor - bold, underline, font size, links, etc. The extension accepts the content in the model, the HTML code to be displayed. It operates on HTML code (for plain text editing, see Contenteditable).

Example of use:

<template>
    <WysiwygEditor v-model="block.data.description"></WysiwygEditor>
</template>

<script setup>
    const { defineProps, inject } = require('vue');
    const props = defineProps(['block']);
    const block = inject('structure').block(props.block);
    const extensions = inject('extensions.registry');

    const WysiwygEditor = extensions.editor('WysiwygEditor');
</script>