MAGETWO-38867: Create mixin for declarative widget description

Author: Ihor Melnychenko

lib/web/mage/apply/main.js

@@ -32,7 +32,29 @@ define([
             }
         });
     }
+    /**
+     * Initializes mixins assigned to a specfied component.
+     *
+     * @param {Object} mixins - object contains mixins list.
+     * @param {Object} itemContainer - object with component config and DOM element link.
+     */
+    function initMixins(mixins, itemContainer){
+        var configStack = {},
+            element = itemContainer.el;
 
+        _.each(mixins, function (mixin, componentName) {
+            configStack = itemContainer.data[componentName];
+            _.each(mixin, function (item) {
+                require([item], function (fn) {
+                    configStack = fn(configStack, element);
+                });
+            });
+            itemContainer.data[componentName] = configStack;
+        });
+        delete itemContainer.data.mixins;
+
+        return itemContainer;
+    }
     /**
      * Parses elements 'data-mage-init' attribute as a valid JSON data.
      * Note: data-mage-init attribute will be removed.
@@ -65,11 +87,16 @@ define([
             _.toArray(nodes)
                 .map(getData)
                 .concat(virtuals)
-                .forEach(function (item) {
-                    _.each(item.data, init.bind(null, item.el));
+                .forEach(function (itemContainer) {
+                    var mixins = itemContainer.data.mixins;
+
+                    if(mixins) {
+                        $.when(itemContainer = initMixins(mixins, itemContainer)).then(_.each(itemContainer.data, init.bind(null, itemContainer.el)));
+                    } else {
+                        _.each(itemContainer.data, init.bind(null, itemContainer.el));
+                    }
                 });
         },
-
         applyFor: init
     };
 });