Cara Meng-Blacklist Format Tertentu dari Quill.js

Kalau kamu pakai Quill.js, mungkin kamu pernah meng-kopi paste sebuah teks ke editor Quill.js-mu, tapi malahan warna teks dan background teksnya juga ikut terkopi. Sama, saya juga pernah.. Pada blog ini, saya akan menjelaskan secara singkat cara yang saya lakukan untuk mengatasi hal tersebut.

Mengkonfigurasi Formats

Kalau kita lihat di dokumentasi Quill.js, ada yang namanya Formats. Formats ini merupakan kumpulan format yang bisa diterima atau tidak oleh editor Quill.js. Secara lengkap formatnya adalah sebagai berikut:

• Inline
• Background Color - background
• Bold - bold
• Color - color
• Font - font
• Inline Code - code
• Italic - italic
• Link - link
• Size - size
• Strikethrough - strike
• Superscript/Subscript - script
• Underline - underline
• Block
• Blockquote - blockquote
• Header - header
• Indent - indent
• List - list
• Text Alignment - align
• Text Direction - direction
• Code Block - code-block
• Embeds
• Formula - formula (memerlukan KaTeX)
• Image - image
• Video - video

Secara default, Quill.js menerima semua format di atas dengan cara. Jadi, yang perlu kita lakukan untuk meng-blacklist format tertentu adalah dengan cara membuat whitelist dari format-format yang ingin kita terima saja. Misal, kita tidak ingin menerima format color dan background:

const quill = new Quill('#editor', {
    formats: ["bold", "font", "code", "italic", "link", "size", "strike", "script", "underline", "blockquote", "header", "indent", "list", "align", "direction", "code-block", "formula", "image", "video"],
    placeholder: 'Compose an epic...',
    theme: 'snow',
  });

Sekian blog singkat ini. Dengan ini, kamu telah berhasil meng-blacklist format yang tidak kamu inginkan pada editor Quill.js-mu. Share ke teman-temanmu jika kamu rada blog ini cukup membantu.

Link referensi

• https://quilljs.com/docs/formats