Tiptapify

Editor formátovaného textu Tiptap 3 pro Vue 3 s panelem nástrojů postaveným na Vuetify 3

Stav Beta

Projekt je aktuálně ve stavu Beta. Funkčně je kompletní, ale mohou v něm být ještě chyby k opravě.

Funkce

Komponenty Vuetify 3

Přehledný panel nástrojů v duchu Material Design, postavený výhradně z komponent Vuetify 3

30+ rozšíření

Formátování textu, vkládání médií, tabulky a bloky kódu se zvýrazněním syntaxe

Příkazy s lomítkem

Zadáním / otevřete nabídku rychlého vložení nadpisů, seznamů, médií a dalšího

Internacionalizace

Více než 20 jazyků díky vue-i18n

Tmavý motiv

Automatická podpora tmavého a světlého režimu, který se napojí na motiv Vuetify

TypeScript

Plná podpora TypeScriptu s exportovanými typy pro všechny položky panelu nástrojů i props

Rychlý start

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>

Peer závislosti

Tiptapify vyžaduje jako peer závislosti Vue 3.x, Vuetify 3.x nebo 4.x, vue-i18n 11+ a @mdi/js. Kompletní postup najdete v průvodci instalací.

Licence

MIT — repozitář na GitHubu