8
0
Просмотр исходного кода

Docs: Moved mixins definitions to interfaces, because interfaces declare their shape.

Piotrek Koszuliński 8 лет назад
Родитель
Сommit
bd67d8ae2b

+ 3 - 5
packages/ckeditor5-utils/src/dom/emittermixin.js

@@ -31,7 +31,7 @@ import isWindow from './iswindow';
  *			console.log( evt, domEvt );
  *		} );
  *
- * @mixin module:utils/dom/emittermixin~EmitterMixin
+ * @mixin EmitterMixin
  * @mixes module:utils/emittermixin~EmitterMixin
  * @implements module:utils/dom/emittermixin~Emitter
  */
@@ -40,7 +40,6 @@ const DomEmitterMixin = extend( {}, EmitterMixin, {
 	 * Registers a callback function to be executed when an event is fired in a specific Emitter or DOM Node.
 	 * It is backwards compatible with {@link module:utils/emittermixin~EmitterMixin#listenTo}.
 	 *
-	 * @method module:utils/dom/emittermixin~EmitterMixin#listenTo
 	 * @param {module:utils/emittermixin~Emitter|Node} emitter The object that fires the event.
 	 * @param {String} event The name of the event.
 	 * @param {Function} callback The function to be called on event.
@@ -75,7 +74,6 @@ const DomEmitterMixin = extend( {}, EmitterMixin, {
 	 * * To stop listening to all events fired by a specific object.
 	 * * To stop listening to all events fired by all object.
 	 *
-	 * @method module:utils/dom/emittermixin~EmitterMixin#stopListening
 	 * @param {module:utils/emittermixin~Emitter|Node} [emitter] The object to stop listening to. If omitted, stops it for all objects.
 	 * @param {String} [event] (Requires the `emitter`) The name of the event to stop listening to. If omitted, stops it
 	 * for all events from `emitter`.
@@ -106,9 +104,9 @@ const DomEmitterMixin = extend( {}, EmitterMixin, {
 	/**
 	 * Retrieves ProxyEmitter instance for given DOM Node residing in this Host.
 	 *
+	 * @pivate
 	 * @param {Node} node DOM Node of the ProxyEmitter.
-	 * @method module:utils/dom/emittermixin~EmitterMixin#_getProxyEmitter
-	 * @return {module:utils/dom/emittermixin~ProxyEmitter} ProxyEmitter instance or null.
+	 * @returns {module:utils/dom/emittermixin~ProxyEmitter} ProxyEmitter instance or null.
 	 */
 	_getProxyEmitter( node ) {
 		return _getEmitterListenedTo( this, getNodeUID( node ) );

+ 146 - 112
packages/ckeditor5-utils/src/emittermixin.js

@@ -15,41 +15,21 @@ const _listeningTo = Symbol( 'listeningTo' );
 const _emitterId = Symbol( 'emitterId' );
 
 /**
- * Mixin that injects the events API into its host.
+ * Mixin that injects the {@link ~Emitter events API} into its host.
  *
  * @mixin EmitterMixin
  * @implements module:utils/emittermixin~Emitter
  */
 const EmitterMixin = {
 	/**
-	 * Registers a callback function to be executed when an event is fired.
-	 *
-	 * Shorthand for {@link #listenTo `this.listenTo( this, event, callback, options )`} (it makes the emitter
-	 * listen on itself).
-	 *
-	 * @method #on
-	 * @param {String} event The name of the event.
-	 * @param {Function} callback The function to be called on event.
-	 * @param {Object} [options={}] Additional options.
-	 * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
-	 * the priority value the sooner the callback will be fired. Events having the same priority are called in the
-	 * order they were added.
+	 * @inheritDoc
 	 */
 	on( event, callback, options = {} ) {
 		this.listenTo( this, event, callback, options );
 	},
 
 	/**
-	 * Registers a callback function to be executed on the next time the event is fired only. This is similar to
-	 * calling {@link #on} followed by {@link #off} in the callback.
-	 *
-	 * @method #once
-	 * @param {String} event The name of the event.
-	 * @param {Function} callback The function to be called on event.
-	 * @param {Object} [options={}] Additional options.
-	 * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
-	 * the priority value the sooner the callback will be fired. Events having the same priority are called in the
-	 * order they were added.
+	 * @inheritDoc
 	 */
 	once( event, callback, options ) {
 		const onceCallback = function( event, ...args ) {
@@ -65,45 +45,14 @@ const EmitterMixin = {
 	},
 
 	/**
-	 * Stops executing the callback on the given event.
-	 * Shorthand for {@link #stopListening `this.stopListening( this, event, callback )`}.
-	 *
-	 * @method #off
-	 * @param {String} event The name of the event.
-	 * @param {Function} callback The function to stop being called.
+	 * @inheritDoc
 	 */
 	off( event, callback ) {
 		this.stopListening( this, event, callback );
 	},
 
 	/**
-	 * Registers a callback function to be executed when an event is fired in a specific (emitter) object.
-	 *
-	 * Events can be grouped in namespaces using `:`.
-	 * When namespaced event is fired, it additionally fires all callbacks for that namespace.
-	 *
-	 *		// myEmitter.on( ... ) is a shorthand for myEmitter.listenTo( myEmitter, ... ).
-	 *		myEmitter.on( 'myGroup', genericCallback );
-	 *		myEmitter.on( 'myGroup:myEvent', specificCallback );
-	 *
-	 *		// genericCallback is fired.
-	 *		myEmitter.fire( 'myGroup' );
-	 *		// both genericCallback and specificCallback are fired.
-	 *		myEmitter.fire( 'myGroup:myEvent' );
-	 *		// genericCallback is fired even though there are no callbacks for "foo".
-	 *		myEmitter.fire( 'myGroup:foo' );
-	 *
-	 * An event callback can {@link module:utils/eventinfo~EventInfo#stop stop the event} and
-	 * set the {@link module:utils/eventinfo~EventInfo#return return value} of the {@link #fire} method.
-	 *
-	 * @method #listenTo
-	 * @param {module:utils/emittermixin~Emitter} emitter The object that fires the event.
-	 * @param {String} event The name of the event.
-	 * @param {Function} callback The function to be called on event.
-	 * @param {Object} [options={}] Additional options.
-	 * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
-	 * the priority value the sooner the callback will be fired. Events having the same priority are called in the
-	 * order they were added.
+	 * @inheritDoc
 	 */
 	listenTo( emitter, event, callback, options = {} ) {
 		let emitterInfo, eventCallbacks;
@@ -179,19 +128,7 @@ const EmitterMixin = {
 	},
 
 	/**
-	 * Stops listening for events. It can be used at different levels:
-	 *
-	 * * To stop listening to a specific callback.
-	 * * To stop listening to a specific event.
-	 * * To stop listening to all events fired by a specific object.
-	 * * To stop listening to all events fired by all objects.
-	 *
-	 * @method #stopListening
-	 * @param {module:utils/emittermixin~Emitter} [emitter] The object to stop listening to. If omitted, stops it for all objects.
-	 * @param {String} [event] (Requires the `emitter`) The name of the event to stop listening to. If omitted, stops it
-	 * for all events from `emitter`.
-	 * @param {Function} [callback] (Requires the `event`) The function to be removed from the call list for the given
-	 * `event`.
+	 * @inheritDoc
 	 */
 	stopListening( emitter, event, callback ) {
 		const emitters = this[ _listeningTo ];
@@ -233,17 +170,7 @@ const EmitterMixin = {
 	},
 
 	/**
-	 * Fires an event, executing all callbacks registered for it.
-	 *
-	 * The first parameter passed to callbacks is an {@link module:utils/eventinfo~EventInfo} object,
-	 * followed by the optional `args` provided in the `fire()` method call.
-	 *
-	 * @method #fire
-	 * @param {String|module:utils/eventinfo~EventInfo} eventOrInfo The name of the event or `EventInfo` object if event is delegated.
-	 * @param {...*} [args] Additional arguments to be passed to the callbacks.
-	 * @returns {*} By default the method returns `undefined`. However, the return value can be changed by listeners
-	 * through modification of the {@link module:utils/eventinfo~EventInfo#return `evt.return`}'s property (the event info
-	 * is the first param of every callback).
+	 * @inheritDoc
 	 */
 	fire( eventOrInfo, ...args ) {
 		const eventInfo = eventOrInfo instanceof EventInfo ? eventOrInfo : new EventInfo( this, eventOrInfo );
@@ -301,22 +228,7 @@ const EmitterMixin = {
 	},
 
 	/**
-	 * Delegates selected events to another {@link module:utils/emittermixin~Emitter}. For instance:
-	 *
-	 *		emitterA.delegate( 'eventX' ).to( emitterB );
-	 *		emitterA.delegate( 'eventX', 'eventY' ).to( emitterC );
-	 *
-	 * then `eventX` is delegated (fired by) `emitterB` and `emitterC` along with `data`:
-	 *
-	 *		emitterA.fire( 'eventX', data );
-	 *
-	 * and `eventY` is delegated (fired by) `emitterC` along with `data`:
-	 *
-	 *		emitterA.fire( 'eventY', data );
-	 *
-	 * @method #delegate
-	 * @param {...String} events Event names that will be delegated to another emitter.
-	 * @returns {module:utils/emittermixin~EmitterMixinDelegateChain}
+	 * @inheritDoc
 	 */
 	delegate( ...events ) {
 		return {
@@ -339,16 +251,7 @@ const EmitterMixin = {
 	},
 
 	/**
-	 * Stops delegating events. It can be used at different levels:
-	 *
-	 * * To stop delegating all events.
-	 * * To stop delegating a specific event to all emitters.
-	 * * To stop delegating a specific event to a specific emitter.
-	 *
-	 * @method #stopDelegating
-	 * @param {String} [event] The name of the event to stop delegating. If omitted, stops it all delegations.
-	 * @param {module:utils/emittermixin~Emitter} [emitter] (requires `event`) The object to stop delegating a particular event to.
-	 * If omitted, stops delegation of `event` to all emitters.
+	 * @inheritDoc
 	 */
 	stopDelegating( event, emitter ) {
 		if ( !this._delegations ) {
@@ -371,6 +274,143 @@ const EmitterMixin = {
 
 export default EmitterMixin;
 
+/**
+ * Emitter/listener interface.
+ *
+ * Can be easily implemented by a class by mixing the {@link module:utils/emittermixin~EmitterMixin} mixin.
+ *
+ * @interface Emitter
+ */
+
+/**
+ * Registers a callback function to be executed when an event is fired.
+ *
+ * Shorthand for {@link #listenTo `this.listenTo( this, event, callback, options )`} (it makes the emitter
+ * listen on itself).
+ *
+ * @method #on
+ * @param {String} event The name of the event.
+ * @param {Function} callback The function to be called on event.
+ * @param {Object} [options={}] Additional options.
+ * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
+ * the priority value the sooner the callback will be fired. Events having the same priority are called in the
+ * order they were added.
+ */
+
+/**
+ * Registers a callback function to be executed on the next time the event is fired only. This is similar to
+ * calling {@link #on} followed by {@link #off} in the callback.
+ *
+ * @method #once
+ * @param {String} event The name of the event.
+ * @param {Function} callback The function to be called on event.
+ * @param {Object} [options={}] Additional options.
+ * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
+ * the priority value the sooner the callback will be fired. Events having the same priority are called in the
+ * order they were added.
+ */
+
+/**
+ * Stops executing the callback on the given event.
+ * Shorthand for {@link #stopListening `this.stopListening( this, event, callback )`}.
+ *
+ * @method #off
+ * @param {String} event The name of the event.
+ * @param {Function} callback The function to stop being called.
+ */
+
+/**
+ * Registers a callback function to be executed when an event is fired in a specific (emitter) object.
+ *
+ * Events can be grouped in namespaces using `:`.
+ * When namespaced event is fired, it additionally fires all callbacks for that namespace.
+ *
+ *		// myEmitter.on( ... ) is a shorthand for myEmitter.listenTo( myEmitter, ... ).
+ *		myEmitter.on( 'myGroup', genericCallback );
+ *		myEmitter.on( 'myGroup:myEvent', specificCallback );
+ *
+ *		// genericCallback is fired.
+ *		myEmitter.fire( 'myGroup' );
+ *		// both genericCallback and specificCallback are fired.
+ *		myEmitter.fire( 'myGroup:myEvent' );
+ *		// genericCallback is fired even though there are no callbacks for "foo".
+ *		myEmitter.fire( 'myGroup:foo' );
+ *
+ * An event callback can {@link module:utils/eventinfo~EventInfo#stop stop the event} and
+ * set the {@link module:utils/eventinfo~EventInfo#return return value} of the {@link #fire} method.
+ *
+ * @method #listenTo
+ * @param {module:utils/emittermixin~Emitter} emitter The object that fires the event.
+ * @param {String} event The name of the event.
+ * @param {Function} callback The function to be called on event.
+ * @param {Object} [options={}] Additional options.
+ * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
+ * the priority value the sooner the callback will be fired. Events having the same priority are called in the
+ * order they were added.
+ */
+
+/**
+ * Stops listening for events. It can be used at different levels:
+ *
+ * * To stop listening to a specific callback.
+ * * To stop listening to a specific event.
+ * * To stop listening to all events fired by a specific object.
+ * * To stop listening to all events fired by all objects.
+ *
+ * @method #stopListening
+ * @param {module:utils/emittermixin~Emitter} [emitter] The object to stop listening to. If omitted, stops it for all objects.
+ * @param {String} [event] (Requires the `emitter`) The name of the event to stop listening to. If omitted, stops it
+ * for all events from `emitter`.
+ * @param {Function} [callback] (Requires the `event`) The function to be removed from the call list for the given
+ * `event`.
+ */
+
+/**
+ * Fires an event, executing all callbacks registered for it.
+ *
+ * The first parameter passed to callbacks is an {@link module:utils/eventinfo~EventInfo} object,
+ * followed by the optional `args` provided in the `fire()` method call.
+ *
+ * @method #fire
+ * @param {String|module:utils/eventinfo~EventInfo} eventOrInfo The name of the event or `EventInfo` object if event is delegated.
+ * @param {...*} [args] Additional arguments to be passed to the callbacks.
+ * @returns {*} By default the method returns `undefined`. However, the return value can be changed by listeners
+ * through modification of the {@link module:utils/eventinfo~EventInfo#return `evt.return`}'s property (the event info
+ * is the first param of every callback).
+ */
+
+/**
+ * Delegates selected events to another {@link module:utils/emittermixin~Emitter}. For instance:
+ *
+ *		emitterA.delegate( 'eventX' ).to( emitterB );
+ *		emitterA.delegate( 'eventX', 'eventY' ).to( emitterC );
+ *
+ * then `eventX` is delegated (fired by) `emitterB` and `emitterC` along with `data`:
+ *
+ *		emitterA.fire( 'eventX', data );
+ *
+ * and `eventY` is delegated (fired by) `emitterC` along with `data`:
+ *
+ *		emitterA.fire( 'eventY', data );
+ *
+ * @method #delegate
+ * @param {...String} events Event names that will be delegated to another emitter.
+ * @returns {module:utils/emittermixin~EmitterMixinDelegateChain}
+ */
+
+/**
+ * Stops delegating events. It can be used at different levels:
+ *
+ * * To stop delegating all events.
+ * * To stop delegating a specific event to all emitters.
+ * * To stop delegating a specific event to a specific emitter.
+ *
+ * @method #stopDelegating
+ * @param {String} [event] The name of the event to stop delegating. If omitted, stops it all delegations.
+ * @param {module:utils/emittermixin~Emitter} [emitter] (requires `event`) The object to stop delegating a particular event to.
+ * If omitted, stops delegation of `event` to all emitters.
+ */
+
 /**
  * Checks if `listeningEmitter` listens to an emitter with given `listenedToEmitterId` and if so, returns that emitter.
  * If not, returns `null`.
@@ -584,12 +624,6 @@ function removeCallback( emitter, event, callback ) {
 	}
 }
 
-/**
- * Interface representing classes which mix in {@link module:utils/emittermixin~EmitterMixin}.
- *
- * @interface Emitter
- */
-
 /**
  * The return value of {@link ~EmitterMixin#delegate}.
  *

+ 148 - 151
packages/ckeditor5-utils/src/observablemixin.js

@@ -17,8 +17,8 @@ const boundObservablesSymbol = Symbol( 'boundObservables' );
 const boundAttributesSymbol = Symbol( 'boundAttributes' );
 
 /**
- * Mixin that injects the "observable attributes" and data binding functionality.
- * Used mainly in the {@link module:ui/model~Model} class.
+ * Mixin that injects the "observable properties" and data binding functionality described in the
+ * {@link ~Observable} interface.
  *
  * @mixin ObservableMixin
  * @mixes module:utils/emittermixin~EmitterMixin
@@ -26,18 +26,7 @@ const boundAttributesSymbol = Symbol( 'boundAttributes' );
  */
 const ObservableMixin = {
 	/**
-	 * Creates and sets the value of an observable attribute of this object. Such an attribute becomes a part
-	 * of the state and is be observable.
-	 *
-	 * It accepts also a single object literal containing key/value pairs with attributes to be set.
-	 *
-	 * This method throws the observable-set-cannot-override error if the observable instance already
-	 * have a property with a given attribute name. This prevents from mistakenly overriding existing
-	 * properties and methods, but means that `foo.set( 'bar', 1 )` may be slightly slower than `foo.bar = 1`.
-	 *
-	 * @method #set
-	 * @param {String} name The attributes name.
-	 * @param {*} value The attributes value.
+	 * @inheritDoc
 	 */
 	set( name, value ) {
 		// If the first parameter is an Object, iterate over its properties.
@@ -96,23 +85,7 @@ const ObservableMixin = {
 	},
 
 	/**
-	 * Binds observable attributes to another objects implementing {@link ~ObservableMixin}
-	 * interface (like {@link module:ui/model~Model}).
-	 *
-	 * Once bound, the observable will immediately share the current state of attributes
-	 * of the observable it is bound to and react to the changes to these attributes
-	 * in the future.
-	 *
-	 * **Note**: To release the binding use {@link module:utils/observablemixin~ObservableMixin#unbind}.
-	 *
-	 *		A.bind( 'a' ).to( B );
-	 *		A.bind( 'a' ).to( B, 'b' );
-	 *		A.bind( 'a', 'b' ).to( B, 'c', 'd' );
-	 *		A.bind( 'a' ).to( B, 'b', C, 'd', ( b, d ) => b + d );
-	 *
-	 * @method #bind
-	 * @param {...String} bindAttrs Observable attributes that will be bound to another observable(s).
-	 * @returns {module:utils/observablemixin~BindChain}
+	 * @inheritDoc
 	 */
 	bind( ...bindAttrs ) {
 		if ( !bindAttrs.length || !isStringArray( bindAttrs ) ) {
@@ -150,13 +123,10 @@ const ObservableMixin = {
 
 		const bindings = new Map();
 
-		/**
-		 * @typedef Binding
-		 * @type Object
-		 * @property {Array} attr Attribute which is bound.
-		 * @property {Array} to Array of observable–attribute components of the binding (`{ observable: ..., attr: .. }`).
-		 * @property {Array} callback A function which processes `to` components.
-		 */
+		// @typedef {Object} Binding
+		// @property {Array} attr Attribute which is bound.
+		// @property {Array} to Array of observable–attribute components of the binding (`{ observable: ..., attr: .. }`).
+		// @property {Array} callback A function which processes `to` components.
 		bindAttrs.forEach( a => {
 			const binding = { attr: a, to: [] };
 
@@ -164,17 +134,14 @@ const ObservableMixin = {
 			bindings.set( a, binding );
 		} );
 
-		/**
-		 * @typedef BindChain
-		 * @type Object
-		 * @property {Function} to See {@link ~ObservableMixin#_bindTo}.
-		 * @property {module:utils/observablemixin~Observable} _observable The observable which initializes the binding.
-		 * @property {Array} _bindAttrs Array of `_observable` attributes to be bound.
-		 * @property {Array} _to Array of `to()` observable–attributes (`{ observable: toObservable, attrs: ...toAttrs }`).
-		 * @property {Map} _bindings Stores bindings to be kept in
-		 *  {@link ~ObservableMixin#_boundAttributes}/{@link ~ObservableMixin#_boundObservables}
-		 * initiated in this binding chain.
-		 */
+		// @typedef {Object} BindChain
+		// @property {Function} to See {@link ~ObservableMixin#_bindTo}.
+		// @property {module:utils/observablemixin~Observable} _observable The observable which initializes the binding.
+		// @property {Array} _bindAttrs Array of `_observable` attributes to be bound.
+		// @property {Array} _to Array of `to()` observable–attributes (`{ observable: toObservable, attrs: ...toAttrs }`).
+		// @property {Map} _bindings Stores bindings to be kept in
+		// {@link ~ObservableMixin#_boundAttributes}/{@link ~ObservableMixin#_boundObservables}
+		// initiated in this binding chain.
 		return {
 			to: bindTo,
 
@@ -186,14 +153,7 @@ const ObservableMixin = {
 	},
 
 	/**
-	 * Removes the binding created with {@link ~ObservableMixin#bind}.
-	 *
-	 *		A.unbind( 'a' );
-	 *		A.unbind();
-	 *
-	 * @method #unbind
-	 * @param {...String} [unbindAttrs] Observable attributes to be unbound. All the bindings will
-	 * be released if no attributes provided.
+	 * @inheritDoc
 	 */
 	unbind( ...unbindAttrs ) {
 		// Nothing to do here if not inited yet.
@@ -256,61 +216,7 @@ const ObservableMixin = {
 	},
 
 	/**
-	 * Turns the given methods of this object into event-based ones. This means that the new method will fire an event
-	 * (named after the method) and the original action will be plugged as a listener to that event.
-	 *
-	 * This is a very simplified method decoration. Itself it doesn't change the behavior of a method (expect adding the event),
-	 * but it allows to modify it later on by listening to the method's event.
-	 *
-	 * For example, in order to cancel the method execution one can stop the event:
-	 *
-	 *		class Foo {
-	 *			constructor() {
-	 *				this.decorate( 'method' );
-	 *			}
-	 *
-	 *			method() {
-	 *				console.log( 'called!' );
-	 *			}
-	 *		}
-	 *
-	 *		const foo = new Foo();
-	 *		foo.on( 'method', ( evt ) => {
-	 *			evt.stop();
-	 *		}, { priority: 'high' } );
-	 *
-	 *		foo.method(); // Nothing is logged.
-	 *
-	 *
-	 * Note: we used a high priority listener here to execute this callback before the one which
-	 * calls the orignal method (which used the default priority).
-	 *
-	 * It's also possible to change the return value:
-	 *
-	 *		foo.on( 'method', ( evt ) => {
-	 *			evt.return = 'Foo!';
-	 *		} );
-	 *
-	 *		foo.method(); // -> 'Foo'
-	 *
-	 * Finally, it's possible to access and modify the parameters:
-	 *
-	 *		method( a, b ) {
-	 *			console.log( `${ a }, ${ b }`  );
-	 *		}
-	 *
-	 *		// ...
-	 *
-	 *		foo.on( 'method', ( evt, args ) => {
-	 *			args[ 0 ] = 3;
-	 *
-	 *			console.log( args[ 1 ] ); // -> 2
-	 *		}, { priority: 'high' } );
-	 *
-	 *		foo.method( 1, 2 ); // -> '3, 2'
-	 *
-	 * @method #decorate
-	 * @param {String} methodName Name of the method to decorate.
+	 * @inheritDoc
 	 */
 	decorate( methodName ) {
 		const originalMethod = this[ methodName ];
@@ -337,24 +243,140 @@ const ObservableMixin = {
 			return this.fire( methodName, args );
 		};
 	}
+};
 
-	/**
-	 * @private
-	 * @member ~ObservableMixin#_boundAttributes
-	 */
+extend( ObservableMixin, EmitterMixin );
 
-	/**
-	 * @private
-	 * @member ~ObservableMixin#_boundObservables
-	 */
+export default ObservableMixin;
 
-	/**
-	 * @private
-	 * @member ~ObservableMixin#_bindTo
-	 */
-};
+/**
+ * Interface which adds "observable properties" and data binding functionality.
+ *
+ * Can be easily implemented by a class by mixing the {@link module:utils/observablemixin~ObservableMixin} mixin.
+ *
+ * @interface Observable
+ */
 
-export default ObservableMixin;
+/**
+ * Fired when a property changed value.
+ *
+ *		observable.set( 'prop', 1 );
+ *
+ *		observable.on( 'change:prop', ( evt, propertyName, newValue, oldValue ) => {
+ *			console.log( `${ propertyName } has changed from ${ oldValue } to ${ newValue }` );
+ *		} )
+ *
+ *		observable.prop = 2; // -> 'prop has changed from 1 to 2'
+ *
+ * @event #change:{property}
+ * @param {String} name The property name.
+ * @param {*} value The new property value.
+ * @param {*} oldValue The previous property value.
+ */
+
+/**
+ * Creates and sets the value of an observable property of this object. Such an property becomes a part
+ * of the state and is be observable.
+ *
+ * It accepts also a single object literal containing key/value pairs with propertys to be set.
+ *
+ * This method throws the `observable-set-cannot-override` error if the observable instance already
+ * have a property with the given property name. This prevents from mistakenly overriding existing
+ * properties and methods, but means that `foo.set( 'bar', 1 )` may be slightly slower than `foo.bar = 1`.
+ *
+ * @method #set
+ * @param {String} name The attributes name.
+ * @param {*} value The attributes value.
+ */
+
+/**
+ * Binds observable properties to another objects implementing {@link module:utils/observablemixin~Observable}
+ * interface (like {@link module:ui/model~Model}).
+ *
+ * Once bound, the observable will immediately share the current state of properties
+ * of the observable it is bound to and react to the changes to these properties
+ * in the future.
+ *
+ * **Note**: To release the binding use {@link module:utils/observablemixin~Observable#unbind}.
+ *
+ *		A.bind( 'a' ).to( B );
+ *		A.bind( 'a' ).to( B, 'b' );
+ *		A.bind( 'a', 'b' ).to( B, 'c', 'd' );
+ *		A.bind( 'a' ).to( B, 'b', C, 'd', ( b, d ) => b + d );
+ *
+ * @method #bind
+ * @param {...String} bindAttrs Observable properties that will be bound to another observable(s).
+ * @returns {Object} The bind chain with the `to()` method.
+ */
+
+/**
+ * Removes the binding created with {@link #bind}.
+ *
+ *		A.unbind( 'a' );
+ *		A.unbind();
+ *
+ * @method #unbind
+ * @param {...String} [unbindAttrs] Observable properties to be unbound. All the bindings will
+ * be released if no properties provided.
+ */
+
+/**
+ * Turns the given methods of this object into event-based ones. This means that the new method will fire an event
+ * (named after the method) and the original action will be plugged as a listener to that event.
+ *
+ * This is a very simplified method decoration. Itself it doesn't change the behavior of a method (expect adding the event),
+ * but it allows to modify it later on by listening to the method's event.
+ *
+ * For example, in order to cancel the method execution one can stop the event:
+ *
+ *		class Foo {
+ *			constructor() {
+ *				this.decorate( 'method' );
+ *			}
+ *
+ *			method() {
+ *				console.log( 'called!' );
+ *			}
+ *		}
+ *
+ *		const foo = new Foo();
+ *		foo.on( 'method', ( evt ) => {
+ *			evt.stop();
+ *		}, { priority: 'high' } );
+ *
+ *		foo.method(); // Nothing is logged.
+ *
+ *
+ * Note: we used a high priority listener here to execute this callback before the one which
+ * calls the orignal method (which used the default priority).
+ *
+ * It's also possible to change the return value:
+ *
+ *		foo.on( 'method', ( evt ) => {
+ *			evt.return = 'Foo!';
+ *		} );
+ *
+ *		foo.method(); // -> 'Foo'
+ *
+ * Finally, it's possible to access and modify the parameters:
+ *
+ *		method( a, b ) {
+ *			console.log( `${ a }, ${ b }`  );
+ *		}
+ *
+ *		// ...
+ *
+ *		foo.on( 'method', ( evt, args ) => {
+ *			args[ 0 ] = 3;
+ *
+ *			console.log( args[ 1 ] ); // -> 2
+ *		}, { priority: 'high' } );
+ *
+ *		foo.method( 1, 2 ); // -> '3, 2'
+ *
+ * @method #decorate
+ * @param {String} methodName Name of the method to decorate.
+ */
 
 // Init symbol properties needed to for the observable mechanism to work.
 //
@@ -715,28 +737,3 @@ function attachBindToListeners( observable, toBindings ) {
 		}
 	} );
 }
-
-extend( ObservableMixin, EmitterMixin );
-
-/**
- * Fired when an attribute changed value.
- *
- *		observable.set( 'prop', 1 );
- *
- *		observable.on( 'change:prop', ( evt, propertyName, newValue, oldValue ) => {
- *			console.log( `${ propertyName } has changed from ${ oldValue } to ${ newValue }` );
- *		} )
- *
- *		observable.prop = 2; // -> 'prop has changed from 1 to 2'
- *
- * @event module:utils/observablemixin~ObservableMixin#change:{attribute}
- * @param {String} name The attribute name.
- * @param {*} value The new attribute value.
- * @param {*} oldValue The previous attribute value.
- */
-
-/**
- * Interface representing classes which mix in {@link module:utils/observablemixin~ObservableMixin}.
- *
- * @interface Observable
- */