Improve enable/disable handling

This commit improves the enable/disable handling of the quill instance.
It introduces a new event called `STATE_CHANGE` which gets emitted when
the global `enable()` function is called.

Closes slab#909.

assets/base.styl

@@ -42,6 +42,9 @@ colorItemsPerRow = 7
     .ql-stroke, .ql-stroke-mitter
       stroke: activeColor
 
+.ql-toolbar-disabled
+  pointer-events: none
+
 
 .ql-{themeName}
   box-sizing: border-box

core/editor.js

@@ -15,6 +15,7 @@ class Editor {
     this.scroll = scroll;
     this.emitter = emitter;
     this.emitter.on(Emitter.events.SCROLL_UPDATE, this.update.bind(this, null));
+    this.emitter.on(Emitter.events.STATE_CHANGE, (enabled) => this.enable(enabled));
     this.delta = this.getDelta();
     this.enable();
   }

core/quill.js

@@ -114,7 +114,8 @@ class Quill {
   }
 
   enable(enabled = true) {
-    this.editor.enable(enabled);
+    const args = [enabled, Emitter.sources.API];
+    this.emitter.emit(Emitter.events.STATE_CHANGE, ...args);
     if (!enabled) {
       this.blur();
     }

modules/toolbar.js

@@ -45,6 +45,13 @@ class Toolbar extends Module {
       let [range, ] = this.quill.selection.getRange();  // quill.getSelection triggers update
       this.update(range);
     });
+    this.quill.on(Quill.events.STATE_CHANGE, (enabled) => {
+      if (enabled) {
+        this.container.classList.remove('ql-toolbar-disabled');
+      } else {
+        this.container.classList.add('ql-toolbar-disabled');
+      }
+    });
   }
 
   addHandler(format, handler) {