Quill Attachment

Features

• Supported attachment types
  • Image
  • Video
  • Audio
  • File
• UI
  • Drag and drop
  • Select files
  • Progress bar
  • Error handling

Demo

Install

$ npm install --save quill-attachment

Usage

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/quill-attachment/dist/quill-attachment.css">

<script src="https://cdn.jsdelivr.net/npm/quill-attachment/dist/quill-attachment.js"></script>
<script>
    const quill = new Quill("#editor", {
        modules: {
            uploader: QuillAttachment.config()
        }
    })
</script>

Configure the file upload service

import { attachmentConfig } from 'quill-attachment'
import Quill from 'quill'

const quill = new Quill("#editor", {
  modules: {
    uploader: attachmentConfig({
      type(fileType) {
        
      },
      
      service(files: FileList | File[], handler: any) {
        // ... upload logic
        
        // report progress and complete
        handler.progress(1024)
        handler.completed()
      }
    })
  }
})