dmitrybubyakin/nova-quill-field

A Laravel Nova field.

0.0.3 2019-04-22 11:45 UTC

Requires

• php: >=7.1.0

MIT

• nova
• laravel

README

Installation

composer require dmitrybubyakin/nova-quill-field

Usage

Quill::make('Body')
    ->rules('required')
    ->imageRules('max:2000') // Image validation rules
    ->alwaysShow()
    ->storeImagesUsing(function (UploadedFile $file, Request $request) {
        // Use spatie/laravel-medialibrary to store images
        return (new static::$model)->newInstance(['uuid' => $request->uuid], true)
                            ->addMedia($file)
                            ->toMediaCollection()
                            ->getFullUrl(); // Return URL
    }, ['uuid' => $this->resolveUuid()]) // These attributes will be accessible from the request in the store callback
    ->toolbar([ // Customize toolbar
        [['header' => 1], ['header' => 2]],
        [['align' => ''], ['align' => 'center'], ['align' => 'right'], ['align' => 'justify']],
        ['bold', 'italic', 'underline', 'strike'],
        ['blockquote', 'code'],
        [['list' => 'ordered']],
        ['clean'],
        ['link', 'image']
    ])
    ->placeholder('Write down something...'), // Customize placeholder

Event

• nova-quill-field:loaded — Called only once. You can register some global modules here.
• nova-quill-field:ready — Called every time the component is mounted. You can configure Quill instance here.

import ImageUploader from './ImageUploader'

// Override Image Uploader
Nova.$once('nova-quill-field:loaded', Quill => {
    Quill.register('modules/imageUploader', ImageUploader)
})

// Add icons
Nova.$once('nova-quill-field:loaded', Quill => {
    const icons = Quill.import('ui/icons')

    icons['fullscreen'] = require('!html-loader!../icons/fullscreen.svg')
    icons['fullscreenExit'] = require('!html-loader!../icons/fullscreen-exit.svg')
})

Nova.$on('nova-quill-field:ready', ({ field, quill }) => {
    if (field.attribute !== 'needed-field') return

    quill.keyboard.addBinding({
        key: 'F',
        shortKey: true,
        shiftKey: true,
        handler (range, context) {
            // do something...
        }
    })
})