@shamimsofte/universal-editor-vue3

Vue 3 adapter and components for Universal Editor
564
vue3 tiptap wysiwyg prosemirror rich-text-editor
Install
npm install @shamimsofte/universal-editor-vue3
Latest Version:1.0.1
Vue:3
License:MIT
Last Updated:Oct 11, 2026
Links: GitHub  ·  npm
Maintainer: shamimsofte

@shamimsofte/universal-editor-vue3

npm version License: MIT

Official Vue 3 component and reactive adapter for Universal Rich Text Editor. Compatible with Vue 3.3+, Vite, Nuxt 3, and Vue CLI.

📦 Installation

npm install @shamimsofte/universal-editor-vue3 @shamimsofte/universal-editor-core

🚀 Usage

In a Vue 3 SFC (Composition API / <script setup>):

<template>
  <div class="editor-container">
    <RichTextEditor
      v-model="content"
      placeholder="Type something or press '/' for commands..."
      theme="light"
      :enable-toolbar="true"
      :enable-bubble-menu="true"
      :enable-slash-commands="true"
      :upload-url="'/api/editor/upload'"
      @update="onEditorUpdate"
    />
  </div>
</template>

<script setup>
import { ref } from 'vue';
import { RichTextEditor } from '@shamimsofte/universal-editor-vue3';
import '@shamimsofte/universal-editor-vue3/style.css';

const content = ref('<h1>Welcome!</h1><p>Start writing rich content in Vue 3.</p>');

function onEditorUpdate({ editor }) {
  console.log('Character count:', editor.getText().length);
}
</script>

⚙️ Component Props

Prop Type Default Description
modelValue / v-model string '' Two-way reactive HTML content binding
placeholder string 'Type something...' Placeholder text when empty
theme string 'light' Theme name ('light', 'dark', 'sepia')
enableToolbar boolean true Show top formatting toolbar
enableBubbleMenu boolean true Show floating text selection bubble menu
enableSlashCommands boolean true Enable Notion-style / slash commands
readOnly boolean false Read-only viewer mode
uploadUrl string null Backend endpoint for file/image uploads

📄 License

MIT © shamimSoftE

Related Packages

@shamimsofte/universal-editor-vue2

Vue 2 adapter for Universal Rich Text Editor (Vue 2.6+ & 2.7)

571 0
prosemirror rich-text-editor tiptap wysiwyg vue2
@rozie-ui/tiptap-vue

Idiomatic Vue rich-text editor — one Rozie source compiled to Vue wrapping TipTa...

2,146 1
prosemirror rich-text-editor tiptap wysiwyg component editor rozie rozie-ui vue
guodu-tiptap

A WYSIWYG rich-text editor using tiptap

842 18
prosemirror tiptap vue3 wysiwyg editor vue
@markweave/vue2

Vue 2 adapter for the Markweave Markdown-first WYSIWYG editor.

9,500 1
prosemirror tiptap wysiwyg editor markdown markweave vue2
@markweave/vue3

Vue 3 adapter for the Markweave Markdown-first WYSIWYG editor.

9,230 1
prosemirror tiptap vue3 wysiwyg editor markdown markweave

Version History

Version Released Vue License
1.0.1 ^3.3.0 MIT
1.0.0 ^3.3.0 MIT
Pre-releases (1)
Version Released License
0.0.0-stage