Tiptapify

Editor de texto enriquecido Tiptap 3 para Vue 3 con barra de herramientas implementada en Vuetify 3

Estado Beta

Este proyecto se encuentra actualmente en Beta. Tiene todas las funciones previstas, pero aún puede tener algunos errores por corregir.

Características

Componentes de Vuetify 3

Una elegante barra de herramientas Material Design construida íntegramente con componentes de Vuetify 3

Más de 30 extensiones

Formato de texto enriquecido, incrustación de multimedia, tablas y bloques de código con resaltado de sintaxis

Comandos con barra

Escribe / para abrir el menú de inserción rápida de encabezados, listas, multimedia y más

Internacionalización

Más de 20 idiomas disponibles mediante vue-i18n

Tema oscuro

Modo oscuro y claro automático, integrado con el tema de Vuetify

TypeScript

Compatibilidad total con TypeScript y tipos exportados para todos los elementos de la barra de herramientas y las props

Inicio rápido

bash

npm i tiptapify
# or
pnpm i tiptapify

vue

<script setup lang="ts">
const handleEditorReady = (options) => {
  console.log('HTML:', options.getHTML())
  console.log('JSON:', options.getJSON())
}
</script>

<template>
  <Tiptapify
    placeholder="Start writing..."
    @editor-ready="handleEditorReady"
  />
</template>

Dependencias peer

Tiptapify requiere Vue 3.x, Vuetify 3.x o 4.x, vue-i18n 11+ y @mdi/js como dependencias peer. Consulta la guía de instalación para ver la configuración completa.

Licencia

MIT — Repositorio de GitHub