Introducing mixins, refactored activate/deactivate

* Introduced mixins for selecting logic and pointer logic. Thus making it able to create your own components (with custom template and styles) using on multiselect’s logic.
* Refactored activate / deactivate to be able to remove tryActivate and tryDeactivate which were redundant.
* Removed some unnecessary tests
* Refactored toggle() method to reflect the changes in activate/deactivate methods.
* Changes in activate / deactivate methods require some additional tests that are not provided in this commit.
* Changed the Sass variables to default for enabling customising those. THIS DOES NOT WORK. YET.

package.json

@@ -14,7 +14,7 @@
     "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
   },
   "dependencies": {
-    "vue": "^1.0.18",
+    "vue": "^1.0.21",
     "babel-runtime": "^5.8.0"
   },
   "devDependencies": {

src/App.vue

@@ -1,17 +1,17 @@
 <template>
   <div id="app">
     <h1><img class="logo" src="./assets/logo.png"> Vue-multiselect</h1>
-    <!-- <multiselect
+    <multiselect
       :options="options"
       :selected="selected"
       :multiple="multiple"
       :searchable="searchable"
       :placeholder="placeholder"
     >
-      <span slot="noResult">
-        Oops! No elements found. Consider changing the search query.
-      </span>
-    </multiselect> -->
+      <li slot="beforeList">
+        <a href="#" class="multiselect__option">Some action!</a>
+      </li>
+    </multiselect>
 
     <multiselect
       :options="countries"
@@ -84,7 +84,10 @@ export default {
 }
 </script>
 
-<style>
+<style lang="scss">
+$multiselect-height: 140px;
+$multiselect-background: #000;
+
 html {
   height: 100%;
 }