diff --git a/web/themes/custom/materiotheme/assets/dist/main.js b/web/themes/custom/materiotheme/assets/dist/main.js
index e271e10..e7f8ef0 100644
--- a/web/themes/custom/materiotheme/assets/dist/main.js
+++ b/web/themes/custom/materiotheme/assets/dist/main.js
@@ -421,6 +421,42 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 
 /***/ }),
 
+/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=script&lang=js&":
+/*!*************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=script&lang=js& ***!
+  \*************************************************************************************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _Card = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Card */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n  name: \"Base\",\n  data: function data() {\n    return {};\n  },\n  computed: _objectSpread({}, (0, _vuex.mapState)({\n    items: function items(state) {\n      return state.Search.items;\n    }\n  })),\n  components: {\n    Card: _Card.default\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=script&lang=js&":
+/*!*************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=script&lang=js& ***!
+  \*************************************************************************************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n//\n//\n//\n//\n//\n//\nvar _default = {\n  name: \"Card\",\n  props: ['item'],\n  data: function data() {\n    return {};\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?vue&type=script&lang=js&":
+/*!*************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?vue&type=script&lang=js& ***!
+  \*************************************************************************************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n//\nvar _default = {\n  props: ['html'],\n  // get the html from parent with props\n  data: function data() {\n    return {\n      template_src: null,\n      // record the prop into data as it will be available in every hooks\n      template: null // compiled template from html used in render\n\n    };\n  },\n  beforeMount: function beforeMount() {\n    var _this = this;\n\n    // console.log('Home beforeMount this.html', this.html);\n    if (!this.template_src) {\n      if (this.html) {\n        // if html prop is available record it has data\n        this.template_src = this.html;\n      } else {\n        // else get it from ajax (e.g. if we didn't load the page from home)\n        this.getHomeHtml();\n      }\n    } // compile the html src (coming from parent with props or from ajax call)\n\n\n    if (this.template_src) {\n      this.template = _vue.default.compile(this.template_src);\n      this.$options.staticRenderFns = [];\n      this._staticTrees = [];\n      this.template.staticRenderFns.map(function (fn) {\n        return _this.$options.staticRenderFns.push(fn);\n      });\n    }\n  },\n  methods: {\n    getHomeHtml: function getHomeHtml() {\n      var _this2 = this;\n\n      _maAxios.MA.get(\"/materio_user/login_block\").then(function (_ref) {\n        var data = _ref.data;\n        _this2.template_src = data.rendered; // record the html src into data\n      }).catch(function (error) {\n        console.warn('Issue with getHomeHtml', error);\n      });\n    }\n  },\n  render: function render(h) {\n    if (!this.template) {\n      return h('span', 'Loading ...');\n    } else {\n      return this.template.render.call(this);\n    }\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
 /***/ "./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?vue&type=script&lang=js&":
 /*!********************************************************************************************************************************************************************************************!*\
   !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?vue&type=script&lang=js& ***!
@@ -429,7 +465,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n  props: ['html'],\n  computed: _objectSpread({}, (0, _vuex.mapState)({\n    token: function token(state) {\n      return state.User.token;\n    },\n    isloggedin: function isloggedin(state) {\n      return state.User.isloggedin;\n    }\n  }))\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n  router: _route.default,\n  props: ['id', 'html'] // computed: {\n  //   ...mapState({\n  //     token: state => state.User.token,\n  //     isloggedin: state => state.User.isloggedin\n  //   })\n  // },\n  // beforeMount() {\n  //   console.log('MainContent beforeMount this.html', this.html);\n  // },\n  // mounted() {\n  //   console.log('MainContent this.$router', this.$router);\n  // }\n\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
 
 /***/ }),
 
@@ -441,7 +477,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n  props: ['form'],\n  data: function data() {\n    return {\n      template: null // keys: \"\",\n      // autocomplete: \"\"\n\n    };\n  },\n  computed: {\n    // ...mapState(['Search'])\n    // ...mapState({\n    //   // keys: state => state.Search.keys,\n    //   autocomplete: state => state.Search.autocomplete\n    // }),\n    keys: {\n      get: function get() {\n        return this.$store.state.Search.keys;\n      },\n      set: function set(value) {\n        this.$store.commit('Search/setKeys', value);\n      }\n    },\n    autocomplete: {\n      get: function get() {\n        return this.$store.state.Search.autocomplete;\n      },\n      set: function set(value) {\n        this.$store.commit('Search/setAutocomplete', value);\n      }\n    }\n  },\n  methods: _objectSpread({}, (0, _vuex.mapActions)({\n    getResults: 'Search/getResults'\n  }), {\n    submit: function submit() {\n      console.log(\"search clicked\", this.keys, this.autocomplete);\n      this.getResults();\n    },\n    onAutoCompleteSelect: function onAutoCompleteSelect(event, ui) {\n      event.preventDefault(); // console.log('autoCompleteSelect', event, ui);\n\n      this.keys = ui.item.label;\n      this.autocomplete = ui.item.value;\n    }\n  }),\n  beforeMount: function beforeMount() {\n    var _this = this;\n\n    // console.log('SearchForm beforeMount');\n    if (this._props.form) {\n      // console.log('SearchForm beforeMount if this._props.form ok');\n      this.template = _vue.default.compile(this._props.form); // https://github.com/vuejs/vue/issues/9911\n\n      this.$options.staticRenderFns = [];\n      this._staticTrees = [];\n      this.template.staticRenderFns.map(function (fn) {\n        return _this.$options.staticRenderFns.push(fn);\n      });\n    }\n  },\n  watch: {\n    keys: function keys() {\n      console.log('keys changed', this.keys);\n    }\n  },\n  mounted: function mounted() {\n    // console.log('SearchForm mounted');\n    Drupal.attachBehaviors(this.$el); // Catch the jquery ui events for autocmplete widget\n\n    jQuery(this.$el.querySelector('#edit-search')).on('autocompleteselect', this.onAutoCompleteSelect);\n  },\n  render: function render(h) {\n    // console.log('searchForm render');\n    if (!this.template) {\n      return h('span', 'Loading ...');\n    } else {\n      return this.template.render.call(this);\n    }\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n  router: _route.default,\n  props: ['form'],\n  data: function data() {\n    return {\n      template: null,\n      keys: \"\",\n      autocomplete: \"\"\n    };\n  },\n  methods: _objectSpread({}, (0, _vuex.mapActions)({\n    newSearch: 'Search/newSearch'\n  }), {\n    submit: function submit() {\n      var _this = this;\n\n      console.log(\"search clicked\", this.keys, this.autocomplete);\n      this.newSearch(this.keys, this.autocomplete).then(function () {\n        _this.$router.push({\n          name: 'base'\n        });\n      });\n    },\n    onAutoCompleteSelect: function onAutoCompleteSelect(event, ui) {\n      event.preventDefault(); // console.log('autoCompleteSelect', event, ui);\n\n      this.keys = ui.item.label;\n      this.autocomplete = ui.item.value;\n    }\n  }),\n  beforeMount: function beforeMount() {\n    var _this2 = this;\n\n    // console.log('SearchForm beforeMount');\n    if (this._props.form) {\n      // console.log('SearchForm beforeMount if this._props.form ok');\n      this.template = _vue.default.compile(this._props.form); // https://github.com/vuejs/vue/issues/9911\n\n      this.$options.staticRenderFns = [];\n      this._staticTrees = [];\n      this.template.staticRenderFns.map(function (fn) {\n        return _this2.$options.staticRenderFns.push(fn);\n      });\n    }\n  },\n  watch: {\n    keys: function keys() {\n      console.log('keys changed', this.keys);\n    }\n  },\n  mounted: function mounted() {\n    // console.log('SearchForm mounted');\n    Drupal.attachBehaviors(this.$el); // Catch the jquery ui events for autocmplete widget\n\n    jQuery(this.$el.querySelector('#edit-search')).on('autocompleteselect', this.onAutoCompleteSelect);\n  },\n  render: function render(h) {\n    // console.log('searchForm render');\n    if (!this.template) {\n      return h('span', 'Loading ...');\n    } else {\n      return this.template.render.call(this);\n    }\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options");
 
 /***/ }),
 
@@ -606,6 +642,30 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) *
 
 /***/ }),
 
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=template&id=c60a80ae&scoped=true&":
+/*!***************************************************************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=template&id=c60a80ae&scoped=true& ***!
+  \***************************************************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", { attrs: { id: \"Base\" } }, [\n    _c(\"h1\", [_vm._v(\"Base\")]),\n    _vm._v(\" \"),\n    _c(\"div\", { staticClass: \"results\" }, [\n      _c(\n        \"ul\",\n        _vm._l(_vm.items, function(item) {\n          return _c(\n            \"li\",\n            { key: item.nid },\n            [_c(\"Card\", { attrs: { item: item } })],\n            1\n          )\n        }),\n        0\n      )\n    ])\n  ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=template&id=0318fc68&scoped=true&":
+/*!***************************************************************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=template&id=0318fc68&scoped=true& ***!
+  \***************************************************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", { staticClass: \"card\" }, [\n    _c(\"h1\", [_vm._v(_vm._s(_vm.item.title))])\n  ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
 /***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?vue&type=template&id=4c8c1858&scoped=true&lang=html&":
 /*!********************************************************************************************************************************************************************************************************************************************************************!*\
   !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?vue&type=template&id=4c8c1858&scoped=true&lang=html& ***!
@@ -614,7 +674,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) *
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", {\n    attrs: { id: \"main-content\" },\n    domProps: { innerHTML: _vm._s(_vm.html) }\n  })\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"div\",\n    { attrs: { id: _vm.id } },\n    [\n      _c(\"router-view\", { attrs: { name: \"home\", html: _vm.html } }),\n      _vm._v(\" \"),\n      _c(\"router-view\", { attrs: { name: \"base\" } })\n    ],\n    1\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
 
 /***/ }),
 
@@ -642,6 +702,18 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) *
 
 /***/ }),
 
+/***/ "./node_modules/vue-router/dist/vue-router.esm.js":
+/*!********************************************************!*\
+  !*** ./node_modules/vue-router/dist/vue-router.esm.js ***!
+  \********************************************************/
+/*! exports provided: default */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/*!\n  * vue-router v3.0.2\n  * (c) 2018 Evan You\n  * @license MIT\n  */\n\n/*  */\nfunction assert(condition, message) {\n  if (!condition) {\n    throw new Error(\"[vue-router] \" + message);\n  }\n}\n\nfunction warn(condition, message) {\n  if ( true && !condition) {\n    typeof console !== 'undefined' && console.warn(\"[vue-router] \" + message);\n  }\n}\n\nfunction isError(err) {\n  return Object.prototype.toString.call(err).indexOf('Error') > -1;\n}\n\nfunction extend(a, b) {\n  for (var key in b) {\n    a[key] = b[key];\n  }\n\n  return a;\n}\n\nvar View = {\n  name: 'RouterView',\n  functional: true,\n  props: {\n    name: {\n      type: String,\n      default: 'default'\n    }\n  },\n  render: function render(_, ref) {\n    var props = ref.props;\n    var children = ref.children;\n    var parent = ref.parent;\n    var data = ref.data; // used by devtools to display a router-view badge\n\n    data.routerView = true; // directly use parent context's createElement() function\n    // so that components rendered by router-view can resolve named slots\n\n    var h = parent.$createElement;\n    var name = props.name;\n    var route = parent.$route;\n    var cache = parent._routerViewCache || (parent._routerViewCache = {}); // determine current view depth, also check to see if the tree\n    // has been toggled inactive but kept-alive.\n\n    var depth = 0;\n    var inactive = false;\n\n    while (parent && parent._routerRoot !== parent) {\n      if (parent.$vnode && parent.$vnode.data.routerView) {\n        depth++;\n      }\n\n      if (parent._inactive) {\n        inactive = true;\n      }\n\n      parent = parent.$parent;\n    }\n\n    data.routerViewDepth = depth; // render previous view if the tree is inactive and kept-alive\n\n    if (inactive) {\n      return h(cache[name], data, children);\n    }\n\n    var matched = route.matched[depth]; // render empty node if no matched route\n\n    if (!matched) {\n      cache[name] = null;\n      return h();\n    }\n\n    var component = cache[name] = matched.components[name]; // attach instance registration hook\n    // this will be called in the instance's injected lifecycle hooks\n\n    data.registerRouteInstance = function (vm, val) {\n      // val could be undefined for unregistration\n      var current = matched.instances[name];\n\n      if (val && current !== vm || !val && current === vm) {\n        matched.instances[name] = val;\n      }\n    } // also register instance in prepatch hook\n    // in case the same component instance is reused across different routes\n    ;\n\n    (data.hook || (data.hook = {})).prepatch = function (_, vnode) {\n      matched.instances[name] = vnode.componentInstance;\n    }; // resolve props\n\n\n    var propsToPass = data.props = resolveProps(route, matched.props && matched.props[name]);\n\n    if (propsToPass) {\n      // clone to prevent mutation\n      propsToPass = data.props = extend({}, propsToPass); // pass non-declared props as attrs\n\n      var attrs = data.attrs = data.attrs || {};\n\n      for (var key in propsToPass) {\n        if (!component.props || !(key in component.props)) {\n          attrs[key] = propsToPass[key];\n          delete propsToPass[key];\n        }\n      }\n    }\n\n    return h(component, data, children);\n  }\n};\n\nfunction resolveProps(route, config) {\n  switch (typeof config) {\n    case 'undefined':\n      return;\n\n    case 'object':\n      return config;\n\n    case 'function':\n      return config(route);\n\n    case 'boolean':\n      return config ? route.params : undefined;\n\n    default:\n      if (true) {\n        warn(false, \"props in \\\"\" + route.path + \"\\\" is a \" + typeof config + \", \" + \"expecting an object, function or boolean.\");\n      }\n\n  }\n}\n/*  */\n\n\nvar encodeReserveRE = /[!'()*]/g;\n\nvar encodeReserveReplacer = function (c) {\n  return '%' + c.charCodeAt(0).toString(16);\n};\n\nvar commaRE = /%2C/g; // fixed encodeURIComponent which is more conformant to RFC3986:\n// - escapes [!'()*]\n// - preserve commas\n\nvar encode = function (str) {\n  return encodeURIComponent(str).replace(encodeReserveRE, encodeReserveReplacer).replace(commaRE, ',');\n};\n\nvar decode = decodeURIComponent;\n\nfunction resolveQuery(query, extraQuery, _parseQuery) {\n  if (extraQuery === void 0) extraQuery = {};\n  var parse = _parseQuery || parseQuery;\n  var parsedQuery;\n\n  try {\n    parsedQuery = parse(query || '');\n  } catch (e) {\n     true && warn(false, e.message);\n    parsedQuery = {};\n  }\n\n  for (var key in extraQuery) {\n    parsedQuery[key] = extraQuery[key];\n  }\n\n  return parsedQuery;\n}\n\nfunction parseQuery(query) {\n  var res = {};\n  query = query.trim().replace(/^(\\?|#|&)/, '');\n\n  if (!query) {\n    return res;\n  }\n\n  query.split('&').forEach(function (param) {\n    var parts = param.replace(/\\+/g, ' ').split('=');\n    var key = decode(parts.shift());\n    var val = parts.length > 0 ? decode(parts.join('=')) : null;\n\n    if (res[key] === undefined) {\n      res[key] = val;\n    } else if (Array.isArray(res[key])) {\n      res[key].push(val);\n    } else {\n      res[key] = [res[key], val];\n    }\n  });\n  return res;\n}\n\nfunction stringifyQuery(obj) {\n  var res = obj ? Object.keys(obj).map(function (key) {\n    var val = obj[key];\n\n    if (val === undefined) {\n      return '';\n    }\n\n    if (val === null) {\n      return encode(key);\n    }\n\n    if (Array.isArray(val)) {\n      var result = [];\n      val.forEach(function (val2) {\n        if (val2 === undefined) {\n          return;\n        }\n\n        if (val2 === null) {\n          result.push(encode(key));\n        } else {\n          result.push(encode(key) + '=' + encode(val2));\n        }\n      });\n      return result.join('&');\n    }\n\n    return encode(key) + '=' + encode(val);\n  }).filter(function (x) {\n    return x.length > 0;\n  }).join('&') : null;\n  return res ? \"?\" + res : '';\n}\n/*  */\n\n\nvar trailingSlashRE = /\\/?$/;\n\nfunction createRoute(record, location, redirectedFrom, router) {\n  var stringifyQuery$$1 = router && router.options.stringifyQuery;\n  var query = location.query || {};\n\n  try {\n    query = clone(query);\n  } catch (e) {}\n\n  var route = {\n    name: location.name || record && record.name,\n    meta: record && record.meta || {},\n    path: location.path || '/',\n    hash: location.hash || '',\n    query: query,\n    params: location.params || {},\n    fullPath: getFullPath(location, stringifyQuery$$1),\n    matched: record ? formatMatch(record) : []\n  };\n\n  if (redirectedFrom) {\n    route.redirectedFrom = getFullPath(redirectedFrom, stringifyQuery$$1);\n  }\n\n  return Object.freeze(route);\n}\n\nfunction clone(value) {\n  if (Array.isArray(value)) {\n    return value.map(clone);\n  } else if (value && typeof value === 'object') {\n    var res = {};\n\n    for (var key in value) {\n      res[key] = clone(value[key]);\n    }\n\n    return res;\n  } else {\n    return value;\n  }\n} // the starting route that represents the initial state\n\n\nvar START = createRoute(null, {\n  path: '/'\n});\n\nfunction formatMatch(record) {\n  var res = [];\n\n  while (record) {\n    res.unshift(record);\n    record = record.parent;\n  }\n\n  return res;\n}\n\nfunction getFullPath(ref, _stringifyQuery) {\n  var path = ref.path;\n  var query = ref.query;\n  if (query === void 0) query = {};\n  var hash = ref.hash;\n  if (hash === void 0) hash = '';\n  var stringify = _stringifyQuery || stringifyQuery;\n  return (path || '/') + stringify(query) + hash;\n}\n\nfunction isSameRoute(a, b) {\n  if (b === START) {\n    return a === b;\n  } else if (!b) {\n    return false;\n  } else if (a.path && b.path) {\n    return a.path.replace(trailingSlashRE, '') === b.path.replace(trailingSlashRE, '') && a.hash === b.hash && isObjectEqual(a.query, b.query);\n  } else if (a.name && b.name) {\n    return a.name === b.name && a.hash === b.hash && isObjectEqual(a.query, b.query) && isObjectEqual(a.params, b.params);\n  } else {\n    return false;\n  }\n}\n\nfunction isObjectEqual(a, b) {\n  if (a === void 0) a = {};\n  if (b === void 0) b = {}; // handle null value #1566\n\n  if (!a || !b) {\n    return a === b;\n  }\n\n  var aKeys = Object.keys(a);\n  var bKeys = Object.keys(b);\n\n  if (aKeys.length !== bKeys.length) {\n    return false;\n  }\n\n  return aKeys.every(function (key) {\n    var aVal = a[key];\n    var bVal = b[key]; // check nested equality\n\n    if (typeof aVal === 'object' && typeof bVal === 'object') {\n      return isObjectEqual(aVal, bVal);\n    }\n\n    return String(aVal) === String(bVal);\n  });\n}\n\nfunction isIncludedRoute(current, target) {\n  return current.path.replace(trailingSlashRE, '/').indexOf(target.path.replace(trailingSlashRE, '/')) === 0 && (!target.hash || current.hash === target.hash) && queryIncludes(current.query, target.query);\n}\n\nfunction queryIncludes(current, target) {\n  for (var key in target) {\n    if (!(key in current)) {\n      return false;\n    }\n  }\n\n  return true;\n}\n/*  */\n// work around weird flow bug\n\n\nvar toTypes = [String, Object];\nvar eventTypes = [String, Array];\nvar Link = {\n  name: 'RouterLink',\n  props: {\n    to: {\n      type: toTypes,\n      required: true\n    },\n    tag: {\n      type: String,\n      default: 'a'\n    },\n    exact: Boolean,\n    append: Boolean,\n    replace: Boolean,\n    activeClass: String,\n    exactActiveClass: String,\n    event: {\n      type: eventTypes,\n      default: 'click'\n    }\n  },\n  render: function render(h) {\n    var this$1 = this;\n    var router = this.$router;\n    var current = this.$route;\n    var ref = router.resolve(this.to, current, this.append);\n    var location = ref.location;\n    var route = ref.route;\n    var href = ref.href;\n    var classes = {};\n    var globalActiveClass = router.options.linkActiveClass;\n    var globalExactActiveClass = router.options.linkExactActiveClass; // Support global empty active class\n\n    var activeClassFallback = globalActiveClass == null ? 'router-link-active' : globalActiveClass;\n    var exactActiveClassFallback = globalExactActiveClass == null ? 'router-link-exact-active' : globalExactActiveClass;\n    var activeClass = this.activeClass == null ? activeClassFallback : this.activeClass;\n    var exactActiveClass = this.exactActiveClass == null ? exactActiveClassFallback : this.exactActiveClass;\n    var compareTarget = location.path ? createRoute(null, location, null, router) : route;\n    classes[exactActiveClass] = isSameRoute(current, compareTarget);\n    classes[activeClass] = this.exact ? classes[exactActiveClass] : isIncludedRoute(current, compareTarget);\n\n    var handler = function (e) {\n      if (guardEvent(e)) {\n        if (this$1.replace) {\n          router.replace(location);\n        } else {\n          router.push(location);\n        }\n      }\n    };\n\n    var on = {\n      click: guardEvent\n    };\n\n    if (Array.isArray(this.event)) {\n      this.event.forEach(function (e) {\n        on[e] = handler;\n      });\n    } else {\n      on[this.event] = handler;\n    }\n\n    var data = {\n      class: classes\n    };\n\n    if (this.tag === 'a') {\n      data.on = on;\n      data.attrs = {\n        href: href\n      };\n    } else {\n      // find the first <a> child and apply listener and href\n      var a = findAnchor(this.$slots.default);\n\n      if (a) {\n        // in case the <a> is a static node\n        a.isStatic = false;\n        var aData = a.data = extend({}, a.data);\n        aData.on = on;\n        var aAttrs = a.data.attrs = extend({}, a.data.attrs);\n        aAttrs.href = href;\n      } else {\n        // doesn't have <a> child, apply listener to self\n        data.on = on;\n      }\n    }\n\n    return h(this.tag, data, this.$slots.default);\n  }\n};\n\nfunction guardEvent(e) {\n  // don't redirect with control keys\n  if (e.metaKey || e.altKey || e.ctrlKey || e.shiftKey) {\n    return;\n  } // don't redirect when preventDefault called\n\n\n  if (e.defaultPrevented) {\n    return;\n  } // don't redirect on right click\n\n\n  if (e.button !== undefined && e.button !== 0) {\n    return;\n  } // don't redirect if `target=\"_blank\"`\n\n\n  if (e.currentTarget && e.currentTarget.getAttribute) {\n    var target = e.currentTarget.getAttribute('target');\n\n    if (/\\b_blank\\b/i.test(target)) {\n      return;\n    }\n  } // this may be a Weex event which doesn't have this method\n\n\n  if (e.preventDefault) {\n    e.preventDefault();\n  }\n\n  return true;\n}\n\nfunction findAnchor(children) {\n  if (children) {\n    var child;\n\n    for (var i = 0; i < children.length; i++) {\n      child = children[i];\n\n      if (child.tag === 'a') {\n        return child;\n      }\n\n      if (child.children && (child = findAnchor(child.children))) {\n        return child;\n      }\n    }\n  }\n}\n\nvar _Vue;\n\nfunction install(Vue) {\n  if (install.installed && _Vue === Vue) {\n    return;\n  }\n\n  install.installed = true;\n  _Vue = Vue;\n\n  var isDef = function (v) {\n    return v !== undefined;\n  };\n\n  var registerInstance = function (vm, callVal) {\n    var i = vm.$options._parentVnode;\n\n    if (isDef(i) && isDef(i = i.data) && isDef(i = i.registerRouteInstance)) {\n      i(vm, callVal);\n    }\n  };\n\n  Vue.mixin({\n    beforeCreate: function beforeCreate() {\n      if (isDef(this.$options.router)) {\n        this._routerRoot = this;\n        this._router = this.$options.router;\n\n        this._router.init(this);\n\n        Vue.util.defineReactive(this, '_route', this._router.history.current);\n      } else {\n        this._routerRoot = this.$parent && this.$parent._routerRoot || this;\n      }\n\n      registerInstance(this, this);\n    },\n    destroyed: function destroyed() {\n      registerInstance(this);\n    }\n  });\n  Object.defineProperty(Vue.prototype, '$router', {\n    get: function get() {\n      return this._routerRoot._router;\n    }\n  });\n  Object.defineProperty(Vue.prototype, '$route', {\n    get: function get() {\n      return this._routerRoot._route;\n    }\n  });\n  Vue.component('RouterView', View);\n  Vue.component('RouterLink', Link);\n  var strats = Vue.config.optionMergeStrategies; // use the same hook merging strategy for route hooks\n\n  strats.beforeRouteEnter = strats.beforeRouteLeave = strats.beforeRouteUpdate = strats.created;\n}\n/*  */\n\n\nvar inBrowser = typeof window !== 'undefined';\n/*  */\n\nfunction resolvePath(relative, base, append) {\n  var firstChar = relative.charAt(0);\n\n  if (firstChar === '/') {\n    return relative;\n  }\n\n  if (firstChar === '?' || firstChar === '#') {\n    return base + relative;\n  }\n\n  var stack = base.split('/'); // remove trailing segment if:\n  // - not appending\n  // - appending to trailing slash (last segment is empty)\n\n  if (!append || !stack[stack.length - 1]) {\n    stack.pop();\n  } // resolve relative path\n\n\n  var segments = relative.replace(/^\\//, '').split('/');\n\n  for (var i = 0; i < segments.length; i++) {\n    var segment = segments[i];\n\n    if (segment === '..') {\n      stack.pop();\n    } else if (segment !== '.') {\n      stack.push(segment);\n    }\n  } // ensure leading slash\n\n\n  if (stack[0] !== '') {\n    stack.unshift('');\n  }\n\n  return stack.join('/');\n}\n\nfunction parsePath(path) {\n  var hash = '';\n  var query = '';\n  var hashIndex = path.indexOf('#');\n\n  if (hashIndex >= 0) {\n    hash = path.slice(hashIndex);\n    path = path.slice(0, hashIndex);\n  }\n\n  var queryIndex = path.indexOf('?');\n\n  if (queryIndex >= 0) {\n    query = path.slice(queryIndex + 1);\n    path = path.slice(0, queryIndex);\n  }\n\n  return {\n    path: path,\n    query: query,\n    hash: hash\n  };\n}\n\nfunction cleanPath(path) {\n  return path.replace(/\\/\\//g, '/');\n}\n\nvar isarray = Array.isArray || function (arr) {\n  return Object.prototype.toString.call(arr) == '[object Array]';\n};\n/**\n * Expose `pathToRegexp`.\n */\n\n\nvar pathToRegexp_1 = pathToRegexp;\nvar parse_1 = parse;\nvar compile_1 = compile;\nvar tokensToFunction_1 = tokensToFunction;\nvar tokensToRegExp_1 = tokensToRegExp;\n/**\n * The main path matching regexp utility.\n *\n * @type {RegExp}\n */\n\nvar PATH_REGEXP = new RegExp([// Match escaped characters that would otherwise appear in future matches.\n// This allows the user to escape special characters that won't transform.\n'(\\\\\\\\.)', // Match Express-style parameters and un-named parameters with a prefix\n// and optional suffixes. Matches appear as:\n//\n// \"/:test(\\\\d+)?\" => [\"/\", \"test\", \"\\d+\", undefined, \"?\", undefined]\n// \"/route(\\\\d+)\"  => [undefined, undefined, undefined, \"\\d+\", undefined, undefined]\n// \"/*\"            => [\"/\", undefined, undefined, undefined, undefined, \"*\"]\n'([\\\\/.])?(?:(?:\\\\:(\\\\w+)(?:\\\\(((?:\\\\\\\\.|[^\\\\\\\\()])+)\\\\))?|\\\\(((?:\\\\\\\\.|[^\\\\\\\\()])+)\\\\))([+*?])?|(\\\\*))'].join('|'), 'g');\n/**\n * Parse a string for the raw tokens.\n *\n * @param  {string}  str\n * @param  {Object=} options\n * @return {!Array}\n */\n\nfunction parse(str, options) {\n  var tokens = [];\n  var key = 0;\n  var index = 0;\n  var path = '';\n  var defaultDelimiter = options && options.delimiter || '/';\n  var res;\n\n  while ((res = PATH_REGEXP.exec(str)) != null) {\n    var m = res[0];\n    var escaped = res[1];\n    var offset = res.index;\n    path += str.slice(index, offset);\n    index = offset + m.length; // Ignore already escaped sequences.\n\n    if (escaped) {\n      path += escaped[1];\n      continue;\n    }\n\n    var next = str[index];\n    var prefix = res[2];\n    var name = res[3];\n    var capture = res[4];\n    var group = res[5];\n    var modifier = res[6];\n    var asterisk = res[7]; // Push the current path onto the tokens.\n\n    if (path) {\n      tokens.push(path);\n      path = '';\n    }\n\n    var partial = prefix != null && next != null && next !== prefix;\n    var repeat = modifier === '+' || modifier === '*';\n    var optional = modifier === '?' || modifier === '*';\n    var delimiter = res[2] || defaultDelimiter;\n    var pattern = capture || group;\n    tokens.push({\n      name: name || key++,\n      prefix: prefix || '',\n      delimiter: delimiter,\n      optional: optional,\n      repeat: repeat,\n      partial: partial,\n      asterisk: !!asterisk,\n      pattern: pattern ? escapeGroup(pattern) : asterisk ? '.*' : '[^' + escapeString(delimiter) + ']+?'\n    });\n  } // Match any characters still remaining.\n\n\n  if (index < str.length) {\n    path += str.substr(index);\n  } // If the path exists, push it onto the end.\n\n\n  if (path) {\n    tokens.push(path);\n  }\n\n  return tokens;\n}\n/**\n * Compile a string to a template function for the path.\n *\n * @param  {string}             str\n * @param  {Object=}            options\n * @return {!function(Object=, Object=)}\n */\n\n\nfunction compile(str, options) {\n  return tokensToFunction(parse(str, options));\n}\n/**\n * Prettier encoding of URI path segments.\n *\n * @param  {string}\n * @return {string}\n */\n\n\nfunction encodeURIComponentPretty(str) {\n  return encodeURI(str).replace(/[\\/?#]/g, function (c) {\n    return '%' + c.charCodeAt(0).toString(16).toUpperCase();\n  });\n}\n/**\n * Encode the asterisk parameter. Similar to `pretty`, but allows slashes.\n *\n * @param  {string}\n * @return {string}\n */\n\n\nfunction encodeAsterisk(str) {\n  return encodeURI(str).replace(/[?#]/g, function (c) {\n    return '%' + c.charCodeAt(0).toString(16).toUpperCase();\n  });\n}\n/**\n * Expose a method for transforming tokens into the path function.\n */\n\n\nfunction tokensToFunction(tokens) {\n  // Compile all the tokens into regexps.\n  var matches = new Array(tokens.length); // Compile all the patterns before compilation.\n\n  for (var i = 0; i < tokens.length; i++) {\n    if (typeof tokens[i] === 'object') {\n      matches[i] = new RegExp('^(?:' + tokens[i].pattern + ')$');\n    }\n  }\n\n  return function (obj, opts) {\n    var path = '';\n    var data = obj || {};\n    var options = opts || {};\n    var encode = options.pretty ? encodeURIComponentPretty : encodeURIComponent;\n\n    for (var i = 0; i < tokens.length; i++) {\n      var token = tokens[i];\n\n      if (typeof token === 'string') {\n        path += token;\n        continue;\n      }\n\n      var value = data[token.name];\n      var segment;\n\n      if (value == null) {\n        if (token.optional) {\n          // Prepend partial segment prefixes.\n          if (token.partial) {\n            path += token.prefix;\n          }\n\n          continue;\n        } else {\n          throw new TypeError('Expected \"' + token.name + '\" to be defined');\n        }\n      }\n\n      if (isarray(value)) {\n        if (!token.repeat) {\n          throw new TypeError('Expected \"' + token.name + '\" to not repeat, but received `' + JSON.stringify(value) + '`');\n        }\n\n        if (value.length === 0) {\n          if (token.optional) {\n            continue;\n          } else {\n            throw new TypeError('Expected \"' + token.name + '\" to not be empty');\n          }\n        }\n\n        for (var j = 0; j < value.length; j++) {\n          segment = encode(value[j]);\n\n          if (!matches[i].test(segment)) {\n            throw new TypeError('Expected all \"' + token.name + '\" to match \"' + token.pattern + '\", but received `' + JSON.stringify(segment) + '`');\n          }\n\n          path += (j === 0 ? token.prefix : token.delimiter) + segment;\n        }\n\n        continue;\n      }\n\n      segment = token.asterisk ? encodeAsterisk(value) : encode(value);\n\n      if (!matches[i].test(segment)) {\n        throw new TypeError('Expected \"' + token.name + '\" to match \"' + token.pattern + '\", but received \"' + segment + '\"');\n      }\n\n      path += token.prefix + segment;\n    }\n\n    return path;\n  };\n}\n/**\n * Escape a regular expression string.\n *\n * @param  {string} str\n * @return {string}\n */\n\n\nfunction escapeString(str) {\n  return str.replace(/([.+*?=^!:${}()[\\]|\\/\\\\])/g, '\\\\$1');\n}\n/**\n * Escape the capturing group by escaping special characters and meaning.\n *\n * @param  {string} group\n * @return {string}\n */\n\n\nfunction escapeGroup(group) {\n  return group.replace(/([=!:$\\/()])/g, '\\\\$1');\n}\n/**\n * Attach the keys as a property of the regexp.\n *\n * @param  {!RegExp} re\n * @param  {Array}   keys\n * @return {!RegExp}\n */\n\n\nfunction attachKeys(re, keys) {\n  re.keys = keys;\n  return re;\n}\n/**\n * Get the flags for a regexp from the options.\n *\n * @param  {Object} options\n * @return {string}\n */\n\n\nfunction flags(options) {\n  return options.sensitive ? '' : 'i';\n}\n/**\n * Pull out keys from a regexp.\n *\n * @param  {!RegExp} path\n * @param  {!Array}  keys\n * @return {!RegExp}\n */\n\n\nfunction regexpToRegexp(path, keys) {\n  // Use a negative lookahead to match only capturing groups.\n  var groups = path.source.match(/\\((?!\\?)/g);\n\n  if (groups) {\n    for (var i = 0; i < groups.length; i++) {\n      keys.push({\n        name: i,\n        prefix: null,\n        delimiter: null,\n        optional: false,\n        repeat: false,\n        partial: false,\n        asterisk: false,\n        pattern: null\n      });\n    }\n  }\n\n  return attachKeys(path, keys);\n}\n/**\n * Transform an array into a regexp.\n *\n * @param  {!Array}  path\n * @param  {Array}   keys\n * @param  {!Object} options\n * @return {!RegExp}\n */\n\n\nfunction arrayToRegexp(path, keys, options) {\n  var parts = [];\n\n  for (var i = 0; i < path.length; i++) {\n    parts.push(pathToRegexp(path[i], keys, options).source);\n  }\n\n  var regexp = new RegExp('(?:' + parts.join('|') + ')', flags(options));\n  return attachKeys(regexp, keys);\n}\n/**\n * Create a path regexp from string input.\n *\n * @param  {string}  path\n * @param  {!Array}  keys\n * @param  {!Object} options\n * @return {!RegExp}\n */\n\n\nfunction stringToRegexp(path, keys, options) {\n  return tokensToRegExp(parse(path, options), keys, options);\n}\n/**\n * Expose a function for taking tokens and returning a RegExp.\n *\n * @param  {!Array}          tokens\n * @param  {(Array|Object)=} keys\n * @param  {Object=}         options\n * @return {!RegExp}\n */\n\n\nfunction tokensToRegExp(tokens, keys, options) {\n  if (!isarray(keys)) {\n    options =\n    /** @type {!Object} */\n    keys || options;\n    keys = [];\n  }\n\n  options = options || {};\n  var strict = options.strict;\n  var end = options.end !== false;\n  var route = ''; // Iterate over the tokens and create our regexp string.\n\n  for (var i = 0; i < tokens.length; i++) {\n    var token = tokens[i];\n\n    if (typeof token === 'string') {\n      route += escapeString(token);\n    } else {\n      var prefix = escapeString(token.prefix);\n      var capture = '(?:' + token.pattern + ')';\n      keys.push(token);\n\n      if (token.repeat) {\n        capture += '(?:' + prefix + capture + ')*';\n      }\n\n      if (token.optional) {\n        if (!token.partial) {\n          capture = '(?:' + prefix + '(' + capture + '))?';\n        } else {\n          capture = prefix + '(' + capture + ')?';\n        }\n      } else {\n        capture = prefix + '(' + capture + ')';\n      }\n\n      route += capture;\n    }\n  }\n\n  var delimiter = escapeString(options.delimiter || '/');\n  var endsWithDelimiter = route.slice(-delimiter.length) === delimiter; // In non-strict mode we allow a slash at the end of match. If the path to\n  // match already ends with a slash, we remove it for consistency. The slash\n  // is valid at the end of a path match, not in the middle. This is important\n  // in non-ending mode, where \"/test/\" shouldn't match \"/test//route\".\n\n  if (!strict) {\n    route = (endsWithDelimiter ? route.slice(0, -delimiter.length) : route) + '(?:' + delimiter + '(?=$))?';\n  }\n\n  if (end) {\n    route += '$';\n  } else {\n    // In non-ending mode, we need the capturing groups to match as much as\n    // possible by using a positive lookahead to the end or next path segment.\n    route += strict && endsWithDelimiter ? '' : '(?=' + delimiter + '|$)';\n  }\n\n  return attachKeys(new RegExp('^' + route, flags(options)), keys);\n}\n/**\n * Normalize the given path string, returning a regular expression.\n *\n * An empty array can be passed in for the keys, which will hold the\n * placeholder key descriptions. For example, using `/user/:id`, `keys` will\n * contain `[{ name: 'id', delimiter: '/', optional: false, repeat: false }]`.\n *\n * @param  {(string|RegExp|Array)} path\n * @param  {(Array|Object)=}       keys\n * @param  {Object=}               options\n * @return {!RegExp}\n */\n\n\nfunction pathToRegexp(path, keys, options) {\n  if (!isarray(keys)) {\n    options =\n    /** @type {!Object} */\n    keys || options;\n    keys = [];\n  }\n\n  options = options || {};\n\n  if (path instanceof RegExp) {\n    return regexpToRegexp(path,\n    /** @type {!Array} */\n    keys);\n  }\n\n  if (isarray(path)) {\n    return arrayToRegexp(\n    /** @type {!Array} */\n    path,\n    /** @type {!Array} */\n    keys, options);\n  }\n\n  return stringToRegexp(\n  /** @type {string} */\n  path,\n  /** @type {!Array} */\n  keys, options);\n}\n\npathToRegexp_1.parse = parse_1;\npathToRegexp_1.compile = compile_1;\npathToRegexp_1.tokensToFunction = tokensToFunction_1;\npathToRegexp_1.tokensToRegExp = tokensToRegExp_1;\n/*  */\n// $flow-disable-line\n\nvar regexpCompileCache = Object.create(null);\n\nfunction fillParams(path, params, routeMsg) {\n  try {\n    var filler = regexpCompileCache[path] || (regexpCompileCache[path] = pathToRegexp_1.compile(path));\n    return filler(params || {}, {\n      pretty: true\n    });\n  } catch (e) {\n    if (true) {\n      warn(false, \"missing param for \" + routeMsg + \": \" + e.message);\n    }\n\n    return '';\n  }\n}\n/*  */\n\n\nfunction createRouteMap(routes, oldPathList, oldPathMap, oldNameMap) {\n  // the path list is used to control path matching priority\n  var pathList = oldPathList || []; // $flow-disable-line\n\n  var pathMap = oldPathMap || Object.create(null); // $flow-disable-line\n\n  var nameMap = oldNameMap || Object.create(null);\n  routes.forEach(function (route) {\n    addRouteRecord(pathList, pathMap, nameMap, route);\n  }); // ensure wildcard routes are always at the end\n\n  for (var i = 0, l = pathList.length; i < l; i++) {\n    if (pathList[i] === '*') {\n      pathList.push(pathList.splice(i, 1)[0]);\n      l--;\n      i--;\n    }\n  }\n\n  return {\n    pathList: pathList,\n    pathMap: pathMap,\n    nameMap: nameMap\n  };\n}\n\nfunction addRouteRecord(pathList, pathMap, nameMap, route, parent, matchAs) {\n  var path = route.path;\n  var name = route.name;\n\n  if (true) {\n    assert(path != null, \"\\\"path\\\" is required in a route configuration.\");\n    assert(typeof route.component !== 'string', \"route config \\\"component\\\" for path: \" + String(path || name) + \" cannot be a \" + \"string id. Use an actual component instead.\");\n  }\n\n  var pathToRegexpOptions = route.pathToRegexpOptions || {};\n  var normalizedPath = normalizePath(path, parent, pathToRegexpOptions.strict);\n\n  if (typeof route.caseSensitive === 'boolean') {\n    pathToRegexpOptions.sensitive = route.caseSensitive;\n  }\n\n  var record = {\n    path: normalizedPath,\n    regex: compileRouteRegex(normalizedPath, pathToRegexpOptions),\n    components: route.components || {\n      default: route.component\n    },\n    instances: {},\n    name: name,\n    parent: parent,\n    matchAs: matchAs,\n    redirect: route.redirect,\n    beforeEnter: route.beforeEnter,\n    meta: route.meta || {},\n    props: route.props == null ? {} : route.components ? route.props : {\n      default: route.props\n    }\n  };\n\n  if (route.children) {\n    // Warn if route is named, does not redirect and has a default child route.\n    // If users navigate to this route by name, the default child will\n    // not be rendered (GH Issue #629)\n    if (true) {\n      if (route.name && !route.redirect && route.children.some(function (child) {\n        return /^\\/?$/.test(child.path);\n      })) {\n        warn(false, \"Named Route '\" + route.name + \"' has a default child route. \" + \"When navigating to this named route (:to=\\\"{name: '\" + route.name + \"'\\\"), \" + \"the default child route will not be rendered. Remove the name from \" + \"this route and use the name of the default child route for named \" + \"links instead.\");\n      }\n    }\n\n    route.children.forEach(function (child) {\n      var childMatchAs = matchAs ? cleanPath(matchAs + \"/\" + child.path) : undefined;\n      addRouteRecord(pathList, pathMap, nameMap, child, record, childMatchAs);\n    });\n  }\n\n  if (route.alias !== undefined) {\n    var aliases = Array.isArray(route.alias) ? route.alias : [route.alias];\n    aliases.forEach(function (alias) {\n      var aliasRoute = {\n        path: alias,\n        children: route.children\n      };\n      addRouteRecord(pathList, pathMap, nameMap, aliasRoute, parent, record.path || '/' // matchAs\n      );\n    });\n  }\n\n  if (!pathMap[record.path]) {\n    pathList.push(record.path);\n    pathMap[record.path] = record;\n  }\n\n  if (name) {\n    if (!nameMap[name]) {\n      nameMap[name] = record;\n    } else if ( true && !matchAs) {\n      warn(false, \"Duplicate named routes definition: \" + \"{ name: \\\"\" + name + \"\\\", path: \\\"\" + record.path + \"\\\" }\");\n    }\n  }\n}\n\nfunction compileRouteRegex(path, pathToRegexpOptions) {\n  var regex = pathToRegexp_1(path, [], pathToRegexpOptions);\n\n  if (true) {\n    var keys = Object.create(null);\n    regex.keys.forEach(function (key) {\n      warn(!keys[key.name], \"Duplicate param keys in route with path: \\\"\" + path + \"\\\"\");\n      keys[key.name] = true;\n    });\n  }\n\n  return regex;\n}\n\nfunction normalizePath(path, parent, strict) {\n  if (!strict) {\n    path = path.replace(/\\/$/, '');\n  }\n\n  if (path[0] === '/') {\n    return path;\n  }\n\n  if (parent == null) {\n    return path;\n  }\n\n  return cleanPath(parent.path + \"/\" + path);\n}\n/*  */\n\n\nfunction normalizeLocation(raw, current, append, router) {\n  var next = typeof raw === 'string' ? {\n    path: raw\n  } : raw; // named target\n\n  if (next.name || next._normalized) {\n    return next;\n  } // relative params\n\n\n  if (!next.path && next.params && current) {\n    next = extend({}, next);\n    next._normalized = true;\n    var params = extend(extend({}, current.params), next.params);\n\n    if (current.name) {\n      next.name = current.name;\n      next.params = params;\n    } else if (current.matched.length) {\n      var rawPath = current.matched[current.matched.length - 1].path;\n      next.path = fillParams(rawPath, params, \"path \" + current.path);\n    } else if (true) {\n      warn(false, \"relative params navigation requires a current route.\");\n    }\n\n    return next;\n  }\n\n  var parsedPath = parsePath(next.path || '');\n  var basePath = current && current.path || '/';\n  var path = parsedPath.path ? resolvePath(parsedPath.path, basePath, append || next.append) : basePath;\n  var query = resolveQuery(parsedPath.query, next.query, router && router.options.parseQuery);\n  var hash = next.hash || parsedPath.hash;\n\n  if (hash && hash.charAt(0) !== '#') {\n    hash = \"#\" + hash;\n  }\n\n  return {\n    _normalized: true,\n    path: path,\n    query: query,\n    hash: hash\n  };\n}\n/*  */\n\n\nfunction createMatcher(routes, router) {\n  var ref = createRouteMap(routes);\n  var pathList = ref.pathList;\n  var pathMap = ref.pathMap;\n  var nameMap = ref.nameMap;\n\n  function addRoutes(routes) {\n    createRouteMap(routes, pathList, pathMap, nameMap);\n  }\n\n  function match(raw, currentRoute, redirectedFrom) {\n    var location = normalizeLocation(raw, currentRoute, false, router);\n    var name = location.name;\n\n    if (name) {\n      var record = nameMap[name];\n\n      if (true) {\n        warn(record, \"Route with name '\" + name + \"' does not exist\");\n      }\n\n      if (!record) {\n        return _createRoute(null, location);\n      }\n\n      var paramNames = record.regex.keys.filter(function (key) {\n        return !key.optional;\n      }).map(function (key) {\n        return key.name;\n      });\n\n      if (typeof location.params !== 'object') {\n        location.params = {};\n      }\n\n      if (currentRoute && typeof currentRoute.params === 'object') {\n        for (var key in currentRoute.params) {\n          if (!(key in location.params) && paramNames.indexOf(key) > -1) {\n            location.params[key] = currentRoute.params[key];\n          }\n        }\n      }\n\n      if (record) {\n        location.path = fillParams(record.path, location.params, \"named route \\\"\" + name + \"\\\"\");\n        return _createRoute(record, location, redirectedFrom);\n      }\n    } else if (location.path) {\n      location.params = {};\n\n      for (var i = 0; i < pathList.length; i++) {\n        var path = pathList[i];\n        var record$1 = pathMap[path];\n\n        if (matchRoute(record$1.regex, location.path, location.params)) {\n          return _createRoute(record$1, location, redirectedFrom);\n        }\n      }\n    } // no match\n\n\n    return _createRoute(null, location);\n  }\n\n  function redirect(record, location) {\n    var originalRedirect = record.redirect;\n    var redirect = typeof originalRedirect === 'function' ? originalRedirect(createRoute(record, location, null, router)) : originalRedirect;\n\n    if (typeof redirect === 'string') {\n      redirect = {\n        path: redirect\n      };\n    }\n\n    if (!redirect || typeof redirect !== 'object') {\n      if (true) {\n        warn(false, \"invalid redirect option: \" + JSON.stringify(redirect));\n      }\n\n      return _createRoute(null, location);\n    }\n\n    var re = redirect;\n    var name = re.name;\n    var path = re.path;\n    var query = location.query;\n    var hash = location.hash;\n    var params = location.params;\n    query = re.hasOwnProperty('query') ? re.query : query;\n    hash = re.hasOwnProperty('hash') ? re.hash : hash;\n    params = re.hasOwnProperty('params') ? re.params : params;\n\n    if (name) {\n      // resolved named direct\n      var targetRecord = nameMap[name];\n\n      if (true) {\n        assert(targetRecord, \"redirect failed: named route \\\"\" + name + \"\\\" not found.\");\n      }\n\n      return match({\n        _normalized: true,\n        name: name,\n        query: query,\n        hash: hash,\n        params: params\n      }, undefined, location);\n    } else if (path) {\n      // 1. resolve relative redirect\n      var rawPath = resolveRecordPath(path, record); // 2. resolve params\n\n      var resolvedPath = fillParams(rawPath, params, \"redirect route with path \\\"\" + rawPath + \"\\\"\"); // 3. rematch with existing query and hash\n\n      return match({\n        _normalized: true,\n        path: resolvedPath,\n        query: query,\n        hash: hash\n      }, undefined, location);\n    } else {\n      if (true) {\n        warn(false, \"invalid redirect option: \" + JSON.stringify(redirect));\n      }\n\n      return _createRoute(null, location);\n    }\n  }\n\n  function alias(record, location, matchAs) {\n    var aliasedPath = fillParams(matchAs, location.params, \"aliased route with path \\\"\" + matchAs + \"\\\"\");\n    var aliasedMatch = match({\n      _normalized: true,\n      path: aliasedPath\n    });\n\n    if (aliasedMatch) {\n      var matched = aliasedMatch.matched;\n      var aliasedRecord = matched[matched.length - 1];\n      location.params = aliasedMatch.params;\n      return _createRoute(aliasedRecord, location);\n    }\n\n    return _createRoute(null, location);\n  }\n\n  function _createRoute(record, location, redirectedFrom) {\n    if (record && record.redirect) {\n      return redirect(record, redirectedFrom || location);\n    }\n\n    if (record && record.matchAs) {\n      return alias(record, location, record.matchAs);\n    }\n\n    return createRoute(record, location, redirectedFrom, router);\n  }\n\n  return {\n    match: match,\n    addRoutes: addRoutes\n  };\n}\n\nfunction matchRoute(regex, path, params) {\n  var m = path.match(regex);\n\n  if (!m) {\n    return false;\n  } else if (!params) {\n    return true;\n  }\n\n  for (var i = 1, len = m.length; i < len; ++i) {\n    var key = regex.keys[i - 1];\n    var val = typeof m[i] === 'string' ? decodeURIComponent(m[i]) : m[i];\n\n    if (key) {\n      // Fix #1994: using * with props: true generates a param named 0\n      params[key.name || 'pathMatch'] = val;\n    }\n  }\n\n  return true;\n}\n\nfunction resolveRecordPath(path, record) {\n  return resolvePath(path, record.parent ? record.parent.path : '/', true);\n}\n/*  */\n\n\nvar positionStore = Object.create(null);\n\nfunction setupScroll() {\n  // Fix for #1585 for Firefox\n  // Fix for #2195 Add optional third attribute to workaround a bug in safari https://bugs.webkit.org/show_bug.cgi?id=182678\n  window.history.replaceState({\n    key: getStateKey()\n  }, '', window.location.href.replace(window.location.origin, ''));\n  window.addEventListener('popstate', function (e) {\n    saveScrollPosition();\n\n    if (e.state && e.state.key) {\n      setStateKey(e.state.key);\n    }\n  });\n}\n\nfunction handleScroll(router, to, from, isPop) {\n  if (!router.app) {\n    return;\n  }\n\n  var behavior = router.options.scrollBehavior;\n\n  if (!behavior) {\n    return;\n  }\n\n  if (true) {\n    assert(typeof behavior === 'function', \"scrollBehavior must be a function\");\n  } // wait until re-render finishes before scrolling\n\n\n  router.app.$nextTick(function () {\n    var position = getScrollPosition();\n    var shouldScroll = behavior.call(router, to, from, isPop ? position : null);\n\n    if (!shouldScroll) {\n      return;\n    }\n\n    if (typeof shouldScroll.then === 'function') {\n      shouldScroll.then(function (shouldScroll) {\n        scrollToPosition(shouldScroll, position);\n      }).catch(function (err) {\n        if (true) {\n          assert(false, err.toString());\n        }\n      });\n    } else {\n      scrollToPosition(shouldScroll, position);\n    }\n  });\n}\n\nfunction saveScrollPosition() {\n  var key = getStateKey();\n\n  if (key) {\n    positionStore[key] = {\n      x: window.pageXOffset,\n      y: window.pageYOffset\n    };\n  }\n}\n\nfunction getScrollPosition() {\n  var key = getStateKey();\n\n  if (key) {\n    return positionStore[key];\n  }\n}\n\nfunction getElementPosition(el, offset) {\n  var docEl = document.documentElement;\n  var docRect = docEl.getBoundingClientRect();\n  var elRect = el.getBoundingClientRect();\n  return {\n    x: elRect.left - docRect.left - offset.x,\n    y: elRect.top - docRect.top - offset.y\n  };\n}\n\nfunction isValidPosition(obj) {\n  return isNumber(obj.x) || isNumber(obj.y);\n}\n\nfunction normalizePosition(obj) {\n  return {\n    x: isNumber(obj.x) ? obj.x : window.pageXOffset,\n    y: isNumber(obj.y) ? obj.y : window.pageYOffset\n  };\n}\n\nfunction normalizeOffset(obj) {\n  return {\n    x: isNumber(obj.x) ? obj.x : 0,\n    y: isNumber(obj.y) ? obj.y : 0\n  };\n}\n\nfunction isNumber(v) {\n  return typeof v === 'number';\n}\n\nfunction scrollToPosition(shouldScroll, position) {\n  var isObject = typeof shouldScroll === 'object';\n\n  if (isObject && typeof shouldScroll.selector === 'string') {\n    var el = document.querySelector(shouldScroll.selector);\n\n    if (el) {\n      var offset = shouldScroll.offset && typeof shouldScroll.offset === 'object' ? shouldScroll.offset : {};\n      offset = normalizeOffset(offset);\n      position = getElementPosition(el, offset);\n    } else if (isValidPosition(shouldScroll)) {\n      position = normalizePosition(shouldScroll);\n    }\n  } else if (isObject && isValidPosition(shouldScroll)) {\n    position = normalizePosition(shouldScroll);\n  }\n\n  if (position) {\n    window.scrollTo(position.x, position.y);\n  }\n}\n/*  */\n\n\nvar supportsPushState = inBrowser && function () {\n  var ua = window.navigator.userAgent;\n\n  if ((ua.indexOf('Android 2.') !== -1 || ua.indexOf('Android 4.0') !== -1) && ua.indexOf('Mobile Safari') !== -1 && ua.indexOf('Chrome') === -1 && ua.indexOf('Windows Phone') === -1) {\n    return false;\n  }\n\n  return window.history && 'pushState' in window.history;\n}(); // use User Timing api (if present) for more accurate key precision\n\n\nvar Time = inBrowser && window.performance && window.performance.now ? window.performance : Date;\n\nvar _key = genKey();\n\nfunction genKey() {\n  return Time.now().toFixed(3);\n}\n\nfunction getStateKey() {\n  return _key;\n}\n\nfunction setStateKey(key) {\n  _key = key;\n}\n\nfunction pushState(url, replace) {\n  saveScrollPosition(); // try...catch the pushState call to get around Safari\n  // DOM Exception 18 where it limits to 100 pushState calls\n\n  var history = window.history;\n\n  try {\n    if (replace) {\n      history.replaceState({\n        key: _key\n      }, '', url);\n    } else {\n      _key = genKey();\n      history.pushState({\n        key: _key\n      }, '', url);\n    }\n  } catch (e) {\n    window.location[replace ? 'replace' : 'assign'](url);\n  }\n}\n\nfunction replaceState(url) {\n  pushState(url, true);\n}\n/*  */\n\n\nfunction runQueue(queue, fn, cb) {\n  var step = function (index) {\n    if (index >= queue.length) {\n      cb();\n    } else {\n      if (queue[index]) {\n        fn(queue[index], function () {\n          step(index + 1);\n        });\n      } else {\n        step(index + 1);\n      }\n    }\n  };\n\n  step(0);\n}\n/*  */\n\n\nfunction resolveAsyncComponents(matched) {\n  return function (to, from, next) {\n    var hasAsync = false;\n    var pending = 0;\n    var error = null;\n    flatMapComponents(matched, function (def, _, match, key) {\n      // if it's a function and doesn't have cid attached,\n      // assume it's an async component resolve function.\n      // we are not using Vue's default async resolving mechanism because\n      // we want to halt the navigation until the incoming component has been\n      // resolved.\n      if (typeof def === 'function' && def.cid === undefined) {\n        hasAsync = true;\n        pending++;\n        var resolve = once(function (resolvedDef) {\n          if (isESModule(resolvedDef)) {\n            resolvedDef = resolvedDef.default;\n          } // save resolved on async factory in case it's used elsewhere\n\n\n          def.resolved = typeof resolvedDef === 'function' ? resolvedDef : _Vue.extend(resolvedDef);\n          match.components[key] = resolvedDef;\n          pending--;\n\n          if (pending <= 0) {\n            next();\n          }\n        });\n        var reject = once(function (reason) {\n          var msg = \"Failed to resolve async component \" + key + \": \" + reason;\n           true && warn(false, msg);\n\n          if (!error) {\n            error = isError(reason) ? reason : new Error(msg);\n            next(error);\n          }\n        });\n        var res;\n\n        try {\n          res = def(resolve, reject);\n        } catch (e) {\n          reject(e);\n        }\n\n        if (res) {\n          if (typeof res.then === 'function') {\n            res.then(resolve, reject);\n          } else {\n            // new syntax in Vue 2.3\n            var comp = res.component;\n\n            if (comp && typeof comp.then === 'function') {\n              comp.then(resolve, reject);\n            }\n          }\n        }\n      }\n    });\n\n    if (!hasAsync) {\n      next();\n    }\n  };\n}\n\nfunction flatMapComponents(matched, fn) {\n  return flatten(matched.map(function (m) {\n    return Object.keys(m.components).map(function (key) {\n      return fn(m.components[key], m.instances[key], m, key);\n    });\n  }));\n}\n\nfunction flatten(arr) {\n  return Array.prototype.concat.apply([], arr);\n}\n\nvar hasSymbol = typeof Symbol === 'function' && typeof Symbol.toStringTag === 'symbol';\n\nfunction isESModule(obj) {\n  return obj.__esModule || hasSymbol && obj[Symbol.toStringTag] === 'Module';\n} // in Webpack 2, require.ensure now also returns a Promise\n// so the resolve/reject functions may get called an extra time\n// if the user uses an arrow function shorthand that happens to\n// return that Promise.\n\n\nfunction once(fn) {\n  var called = false;\n  return function () {\n    var args = [],\n        len = arguments.length;\n\n    while (len--) args[len] = arguments[len];\n\n    if (called) {\n      return;\n    }\n\n    called = true;\n    return fn.apply(this, args);\n  };\n}\n/*  */\n\n\nvar History = function History(router, base) {\n  this.router = router;\n  this.base = normalizeBase(base); // start with a route object that stands for \"nowhere\"\n\n  this.current = START;\n  this.pending = null;\n  this.ready = false;\n  this.readyCbs = [];\n  this.readyErrorCbs = [];\n  this.errorCbs = [];\n};\n\nHistory.prototype.listen = function listen(cb) {\n  this.cb = cb;\n};\n\nHistory.prototype.onReady = function onReady(cb, errorCb) {\n  if (this.ready) {\n    cb();\n  } else {\n    this.readyCbs.push(cb);\n\n    if (errorCb) {\n      this.readyErrorCbs.push(errorCb);\n    }\n  }\n};\n\nHistory.prototype.onError = function onError(errorCb) {\n  this.errorCbs.push(errorCb);\n};\n\nHistory.prototype.transitionTo = function transitionTo(location, onComplete, onAbort) {\n  var this$1 = this;\n  var route = this.router.match(location, this.current);\n  this.confirmTransition(route, function () {\n    this$1.updateRoute(route);\n    onComplete && onComplete(route);\n    this$1.ensureURL(); // fire ready cbs once\n\n    if (!this$1.ready) {\n      this$1.ready = true;\n      this$1.readyCbs.forEach(function (cb) {\n        cb(route);\n      });\n    }\n  }, function (err) {\n    if (onAbort) {\n      onAbort(err);\n    }\n\n    if (err && !this$1.ready) {\n      this$1.ready = true;\n      this$1.readyErrorCbs.forEach(function (cb) {\n        cb(err);\n      });\n    }\n  });\n};\n\nHistory.prototype.confirmTransition = function confirmTransition(route, onComplete, onAbort) {\n  var this$1 = this;\n  var current = this.current;\n\n  var abort = function (err) {\n    if (isError(err)) {\n      if (this$1.errorCbs.length) {\n        this$1.errorCbs.forEach(function (cb) {\n          cb(err);\n        });\n      } else {\n        warn(false, 'uncaught error during route navigation:');\n        console.error(err);\n      }\n    }\n\n    onAbort && onAbort(err);\n  };\n\n  if (isSameRoute(route, current) && // in the case the route map has been dynamically appended to\n  route.matched.length === current.matched.length) {\n    this.ensureURL();\n    return abort();\n  }\n\n  var ref = resolveQueue(this.current.matched, route.matched);\n  var updated = ref.updated;\n  var deactivated = ref.deactivated;\n  var activated = ref.activated;\n  var queue = [].concat( // in-component leave guards\n  extractLeaveGuards(deactivated), // global before hooks\n  this.router.beforeHooks, // in-component update hooks\n  extractUpdateHooks(updated), // in-config enter guards\n  activated.map(function (m) {\n    return m.beforeEnter;\n  }), // async components\n  resolveAsyncComponents(activated));\n  this.pending = route;\n\n  var iterator = function (hook, next) {\n    if (this$1.pending !== route) {\n      return abort();\n    }\n\n    try {\n      hook(route, current, function (to) {\n        if (to === false || isError(to)) {\n          // next(false) -> abort navigation, ensure current URL\n          this$1.ensureURL(true);\n          abort(to);\n        } else if (typeof to === 'string' || typeof to === 'object' && (typeof to.path === 'string' || typeof to.name === 'string')) {\n          // next('/') or next({ path: '/' }) -> redirect\n          abort();\n\n          if (typeof to === 'object' && to.replace) {\n            this$1.replace(to);\n          } else {\n            this$1.push(to);\n          }\n        } else {\n          // confirm transition and pass on the value\n          next(to);\n        }\n      });\n    } catch (e) {\n      abort(e);\n    }\n  };\n\n  runQueue(queue, iterator, function () {\n    var postEnterCbs = [];\n\n    var isValid = function () {\n      return this$1.current === route;\n    }; // wait until async components are resolved before\n    // extracting in-component enter guards\n\n\n    var enterGuards = extractEnterGuards(activated, postEnterCbs, isValid);\n    var queue = enterGuards.concat(this$1.router.resolveHooks);\n    runQueue(queue, iterator, function () {\n      if (this$1.pending !== route) {\n        return abort();\n      }\n\n      this$1.pending = null;\n      onComplete(route);\n\n      if (this$1.router.app) {\n        this$1.router.app.$nextTick(function () {\n          postEnterCbs.forEach(function (cb) {\n            cb();\n          });\n        });\n      }\n    });\n  });\n};\n\nHistory.prototype.updateRoute = function updateRoute(route) {\n  var prev = this.current;\n  this.current = route;\n  this.cb && this.cb(route);\n  this.router.afterHooks.forEach(function (hook) {\n    hook && hook(route, prev);\n  });\n};\n\nfunction normalizeBase(base) {\n  if (!base) {\n    if (inBrowser) {\n      // respect <base> tag\n      var baseEl = document.querySelector('base');\n      base = baseEl && baseEl.getAttribute('href') || '/'; // strip full URL origin\n\n      base = base.replace(/^https?:\\/\\/[^\\/]+/, '');\n    } else {\n      base = '/';\n    }\n  } // make sure there's the starting slash\n\n\n  if (base.charAt(0) !== '/') {\n    base = '/' + base;\n  } // remove trailing slash\n\n\n  return base.replace(/\\/$/, '');\n}\n\nfunction resolveQueue(current, next) {\n  var i;\n  var max = Math.max(current.length, next.length);\n\n  for (i = 0; i < max; i++) {\n    if (current[i] !== next[i]) {\n      break;\n    }\n  }\n\n  return {\n    updated: next.slice(0, i),\n    activated: next.slice(i),\n    deactivated: current.slice(i)\n  };\n}\n\nfunction extractGuards(records, name, bind, reverse) {\n  var guards = flatMapComponents(records, function (def, instance, match, key) {\n    var guard = extractGuard(def, name);\n\n    if (guard) {\n      return Array.isArray(guard) ? guard.map(function (guard) {\n        return bind(guard, instance, match, key);\n      }) : bind(guard, instance, match, key);\n    }\n  });\n  return flatten(reverse ? guards.reverse() : guards);\n}\n\nfunction extractGuard(def, key) {\n  if (typeof def !== 'function') {\n    // extend now so that global mixins are applied.\n    def = _Vue.extend(def);\n  }\n\n  return def.options[key];\n}\n\nfunction extractLeaveGuards(deactivated) {\n  return extractGuards(deactivated, 'beforeRouteLeave', bindGuard, true);\n}\n\nfunction extractUpdateHooks(updated) {\n  return extractGuards(updated, 'beforeRouteUpdate', bindGuard);\n}\n\nfunction bindGuard(guard, instance) {\n  if (instance) {\n    return function boundRouteGuard() {\n      return guard.apply(instance, arguments);\n    };\n  }\n}\n\nfunction extractEnterGuards(activated, cbs, isValid) {\n  return extractGuards(activated, 'beforeRouteEnter', function (guard, _, match, key) {\n    return bindEnterGuard(guard, match, key, cbs, isValid);\n  });\n}\n\nfunction bindEnterGuard(guard, match, key, cbs, isValid) {\n  return function routeEnterGuard(to, from, next) {\n    return guard(to, from, function (cb) {\n      next(cb);\n\n      if (typeof cb === 'function') {\n        cbs.push(function () {\n          // #750\n          // if a router-view is wrapped with an out-in transition,\n          // the instance may not have been registered at this time.\n          // we will need to poll for registration until current route\n          // is no longer valid.\n          poll(cb, match.instances, key, isValid);\n        });\n      }\n    });\n  };\n}\n\nfunction poll(cb, // somehow flow cannot infer this is a function\ninstances, key, isValid) {\n  if (instances[key] && !instances[key]._isBeingDestroyed // do not reuse being destroyed instance\n  ) {\n      cb(instances[key]);\n    } else if (isValid()) {\n    setTimeout(function () {\n      poll(cb, instances, key, isValid);\n    }, 16);\n  }\n}\n/*  */\n\n\nvar HTML5History = function (History$$1) {\n  function HTML5History(router, base) {\n    var this$1 = this;\n    History$$1.call(this, router, base);\n    var expectScroll = router.options.scrollBehavior;\n    var supportsScroll = supportsPushState && expectScroll;\n\n    if (supportsScroll) {\n      setupScroll();\n    }\n\n    var initLocation = getLocation(this.base);\n    window.addEventListener('popstate', function (e) {\n      var current = this$1.current; // Avoiding first `popstate` event dispatched in some browsers but first\n      // history route not updated since async guard at the same time.\n\n      var location = getLocation(this$1.base);\n\n      if (this$1.current === START && location === initLocation) {\n        return;\n      }\n\n      this$1.transitionTo(location, function (route) {\n        if (supportsScroll) {\n          handleScroll(router, route, current, true);\n        }\n      });\n    });\n  }\n\n  if (History$$1) HTML5History.__proto__ = History$$1;\n  HTML5History.prototype = Object.create(History$$1 && History$$1.prototype);\n  HTML5History.prototype.constructor = HTML5History;\n\n  HTML5History.prototype.go = function go(n) {\n    window.history.go(n);\n  };\n\n  HTML5History.prototype.push = function push(location, onComplete, onAbort) {\n    var this$1 = this;\n    var ref = this;\n    var fromRoute = ref.current;\n    this.transitionTo(location, function (route) {\n      pushState(cleanPath(this$1.base + route.fullPath));\n      handleScroll(this$1.router, route, fromRoute, false);\n      onComplete && onComplete(route);\n    }, onAbort);\n  };\n\n  HTML5History.prototype.replace = function replace(location, onComplete, onAbort) {\n    var this$1 = this;\n    var ref = this;\n    var fromRoute = ref.current;\n    this.transitionTo(location, function (route) {\n      replaceState(cleanPath(this$1.base + route.fullPath));\n      handleScroll(this$1.router, route, fromRoute, false);\n      onComplete && onComplete(route);\n    }, onAbort);\n  };\n\n  HTML5History.prototype.ensureURL = function ensureURL(push) {\n    if (getLocation(this.base) !== this.current.fullPath) {\n      var current = cleanPath(this.base + this.current.fullPath);\n      push ? pushState(current) : replaceState(current);\n    }\n  };\n\n  HTML5History.prototype.getCurrentLocation = function getCurrentLocation() {\n    return getLocation(this.base);\n  };\n\n  return HTML5History;\n}(History);\n\nfunction getLocation(base) {\n  var path = decodeURI(window.location.pathname);\n\n  if (base && path.indexOf(base) === 0) {\n    path = path.slice(base.length);\n  }\n\n  return (path || '/') + window.location.search + window.location.hash;\n}\n/*  */\n\n\nvar HashHistory = function (History$$1) {\n  function HashHistory(router, base, fallback) {\n    History$$1.call(this, router, base); // check history fallback deeplinking\n\n    if (fallback && checkFallback(this.base)) {\n      return;\n    }\n\n    ensureSlash();\n  }\n\n  if (History$$1) HashHistory.__proto__ = History$$1;\n  HashHistory.prototype = Object.create(History$$1 && History$$1.prototype);\n  HashHistory.prototype.constructor = HashHistory; // this is delayed until the app mounts\n  // to avoid the hashchange listener being fired too early\n\n  HashHistory.prototype.setupListeners = function setupListeners() {\n    var this$1 = this;\n    var router = this.router;\n    var expectScroll = router.options.scrollBehavior;\n    var supportsScroll = supportsPushState && expectScroll;\n\n    if (supportsScroll) {\n      setupScroll();\n    }\n\n    window.addEventListener(supportsPushState ? 'popstate' : 'hashchange', function () {\n      var current = this$1.current;\n\n      if (!ensureSlash()) {\n        return;\n      }\n\n      this$1.transitionTo(getHash(), function (route) {\n        if (supportsScroll) {\n          handleScroll(this$1.router, route, current, true);\n        }\n\n        if (!supportsPushState) {\n          replaceHash(route.fullPath);\n        }\n      });\n    });\n  };\n\n  HashHistory.prototype.push = function push(location, onComplete, onAbort) {\n    var this$1 = this;\n    var ref = this;\n    var fromRoute = ref.current;\n    this.transitionTo(location, function (route) {\n      pushHash(route.fullPath);\n      handleScroll(this$1.router, route, fromRoute, false);\n      onComplete && onComplete(route);\n    }, onAbort);\n  };\n\n  HashHistory.prototype.replace = function replace(location, onComplete, onAbort) {\n    var this$1 = this;\n    var ref = this;\n    var fromRoute = ref.current;\n    this.transitionTo(location, function (route) {\n      replaceHash(route.fullPath);\n      handleScroll(this$1.router, route, fromRoute, false);\n      onComplete && onComplete(route);\n    }, onAbort);\n  };\n\n  HashHistory.prototype.go = function go(n) {\n    window.history.go(n);\n  };\n\n  HashHistory.prototype.ensureURL = function ensureURL(push) {\n    var current = this.current.fullPath;\n\n    if (getHash() !== current) {\n      push ? pushHash(current) : replaceHash(current);\n    }\n  };\n\n  HashHistory.prototype.getCurrentLocation = function getCurrentLocation() {\n    return getHash();\n  };\n\n  return HashHistory;\n}(History);\n\nfunction checkFallback(base) {\n  var location = getLocation(base);\n\n  if (!/^\\/#/.test(location)) {\n    window.location.replace(cleanPath(base + '/#' + location));\n    return true;\n  }\n}\n\nfunction ensureSlash() {\n  var path = getHash();\n\n  if (path.charAt(0) === '/') {\n    return true;\n  }\n\n  replaceHash('/' + path);\n  return false;\n}\n\nfunction getHash() {\n  // We can't use window.location.hash here because it's not\n  // consistent across browsers - Firefox will pre-decode it!\n  var href = window.location.href;\n  var index = href.indexOf('#');\n  return index === -1 ? '' : decodeURI(href.slice(index + 1));\n}\n\nfunction getUrl(path) {\n  var href = window.location.href;\n  var i = href.indexOf('#');\n  var base = i >= 0 ? href.slice(0, i) : href;\n  return base + \"#\" + path;\n}\n\nfunction pushHash(path) {\n  if (supportsPushState) {\n    pushState(getUrl(path));\n  } else {\n    window.location.hash = path;\n  }\n}\n\nfunction replaceHash(path) {\n  if (supportsPushState) {\n    replaceState(getUrl(path));\n  } else {\n    window.location.replace(getUrl(path));\n  }\n}\n/*  */\n\n\nvar AbstractHistory = function (History$$1) {\n  function AbstractHistory(router, base) {\n    History$$1.call(this, router, base);\n    this.stack = [];\n    this.index = -1;\n  }\n\n  if (History$$1) AbstractHistory.__proto__ = History$$1;\n  AbstractHistory.prototype = Object.create(History$$1 && History$$1.prototype);\n  AbstractHistory.prototype.constructor = AbstractHistory;\n\n  AbstractHistory.prototype.push = function push(location, onComplete, onAbort) {\n    var this$1 = this;\n    this.transitionTo(location, function (route) {\n      this$1.stack = this$1.stack.slice(0, this$1.index + 1).concat(route);\n      this$1.index++;\n      onComplete && onComplete(route);\n    }, onAbort);\n  };\n\n  AbstractHistory.prototype.replace = function replace(location, onComplete, onAbort) {\n    var this$1 = this;\n    this.transitionTo(location, function (route) {\n      this$1.stack = this$1.stack.slice(0, this$1.index).concat(route);\n      onComplete && onComplete(route);\n    }, onAbort);\n  };\n\n  AbstractHistory.prototype.go = function go(n) {\n    var this$1 = this;\n    var targetIndex = this.index + n;\n\n    if (targetIndex < 0 || targetIndex >= this.stack.length) {\n      return;\n    }\n\n    var route = this.stack[targetIndex];\n    this.confirmTransition(route, function () {\n      this$1.index = targetIndex;\n      this$1.updateRoute(route);\n    });\n  };\n\n  AbstractHistory.prototype.getCurrentLocation = function getCurrentLocation() {\n    var current = this.stack[this.stack.length - 1];\n    return current ? current.fullPath : '/';\n  };\n\n  AbstractHistory.prototype.ensureURL = function ensureURL() {// noop\n  };\n\n  return AbstractHistory;\n}(History);\n/*  */\n\n\nvar VueRouter = function VueRouter(options) {\n  if (options === void 0) options = {};\n  this.app = null;\n  this.apps = [];\n  this.options = options;\n  this.beforeHooks = [];\n  this.resolveHooks = [];\n  this.afterHooks = [];\n  this.matcher = createMatcher(options.routes || [], this);\n  var mode = options.mode || 'hash';\n  this.fallback = mode === 'history' && !supportsPushState && options.fallback !== false;\n\n  if (this.fallback) {\n    mode = 'hash';\n  }\n\n  if (!inBrowser) {\n    mode = 'abstract';\n  }\n\n  this.mode = mode;\n\n  switch (mode) {\n    case 'history':\n      this.history = new HTML5History(this, options.base);\n      break;\n\n    case 'hash':\n      this.history = new HashHistory(this, options.base, this.fallback);\n      break;\n\n    case 'abstract':\n      this.history = new AbstractHistory(this, options.base);\n      break;\n\n    default:\n      if (true) {\n        assert(false, \"invalid mode: \" + mode);\n      }\n\n  }\n};\n\nvar prototypeAccessors = {\n  currentRoute: {\n    configurable: true\n  }\n};\n\nVueRouter.prototype.match = function match(raw, current, redirectedFrom) {\n  return this.matcher.match(raw, current, redirectedFrom);\n};\n\nprototypeAccessors.currentRoute.get = function () {\n  return this.history && this.history.current;\n};\n\nVueRouter.prototype.init = function init(app\n/* Vue component instance */\n) {\n  var this$1 = this;\n   true && assert(install.installed, \"not installed. Make sure to call `Vue.use(VueRouter)` \" + \"before creating root instance.\");\n  this.apps.push(app); // main app already initialized.\n\n  if (this.app) {\n    return;\n  }\n\n  this.app = app;\n  var history = this.history;\n\n  if (history instanceof HTML5History) {\n    history.transitionTo(history.getCurrentLocation());\n  } else if (history instanceof HashHistory) {\n    var setupHashListener = function () {\n      history.setupListeners();\n    };\n\n    history.transitionTo(history.getCurrentLocation(), setupHashListener, setupHashListener);\n  }\n\n  history.listen(function (route) {\n    this$1.apps.forEach(function (app) {\n      app._route = route;\n    });\n  });\n};\n\nVueRouter.prototype.beforeEach = function beforeEach(fn) {\n  return registerHook(this.beforeHooks, fn);\n};\n\nVueRouter.prototype.beforeResolve = function beforeResolve(fn) {\n  return registerHook(this.resolveHooks, fn);\n};\n\nVueRouter.prototype.afterEach = function afterEach(fn) {\n  return registerHook(this.afterHooks, fn);\n};\n\nVueRouter.prototype.onReady = function onReady(cb, errorCb) {\n  this.history.onReady(cb, errorCb);\n};\n\nVueRouter.prototype.onError = function onError(errorCb) {\n  this.history.onError(errorCb);\n};\n\nVueRouter.prototype.push = function push(location, onComplete, onAbort) {\n  this.history.push(location, onComplete, onAbort);\n};\n\nVueRouter.prototype.replace = function replace(location, onComplete, onAbort) {\n  this.history.replace(location, onComplete, onAbort);\n};\n\nVueRouter.prototype.go = function go(n) {\n  this.history.go(n);\n};\n\nVueRouter.prototype.back = function back() {\n  this.go(-1);\n};\n\nVueRouter.prototype.forward = function forward() {\n  this.go(1);\n};\n\nVueRouter.prototype.getMatchedComponents = function getMatchedComponents(to) {\n  var route = to ? to.matched ? to : this.resolve(to).route : this.currentRoute;\n\n  if (!route) {\n    return [];\n  }\n\n  return [].concat.apply([], route.matched.map(function (m) {\n    return Object.keys(m.components).map(function (key) {\n      return m.components[key];\n    });\n  }));\n};\n\nVueRouter.prototype.resolve = function resolve(to, current, append) {\n  var location = normalizeLocation(to, current || this.history.current, append, this);\n  var route = this.match(location, current);\n  var fullPath = route.redirectedFrom || route.fullPath;\n  var base = this.history.base;\n  var href = createHref(base, fullPath, this.mode);\n  return {\n    location: location,\n    route: route,\n    href: href,\n    // for backwards compat\n    normalizedTo: location,\n    resolved: route\n  };\n};\n\nVueRouter.prototype.addRoutes = function addRoutes(routes) {\n  this.matcher.addRoutes(routes);\n\n  if (this.history.current !== START) {\n    this.history.transitionTo(this.history.getCurrentLocation());\n  }\n};\n\nObject.defineProperties(VueRouter.prototype, prototypeAccessors);\n\nfunction registerHook(list, fn) {\n  list.push(fn);\n  return function () {\n    var i = list.indexOf(fn);\n\n    if (i > -1) {\n      list.splice(i, 1);\n    }\n  };\n}\n\nfunction createHref(base, fullPath, mode) {\n  var path = mode === 'hash' ? '#' + fullPath : fullPath;\n  return base ? cleanPath(base + '/' + path) : path;\n}\n\nVueRouter.install = install;\nVueRouter.version = '3.0.2';\n\nif (inBrowser && window.Vue) {\n  window.Vue.use(VueRouter);\n}\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (VueRouter);\n\n//# sourceURL=webpack:///./node_modules/vue-router/dist/vue-router.esm.js?");
+
+/***/ }),
+
 /***/ "./node_modules/vue-style-loader/index.js!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/sass-loader/lib/loader.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Block/LoginBlock.vue?vue&type=style&index=0&id=08f975e8&lang=scss&scoped=true&":
 /*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
   !*** ./node_modules/vue-style-loader!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/sass-loader/lib/loader.js!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Block/LoginBlock.vue?vue&type=style&index=0&id=08f975e8&lang=scss&scoped=true& ***!
@@ -730,7 +802,7 @@ eval("var g; // This works in non-strict mode\n\ng = function () {\n  return thi
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _UserBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/UserBlock.vue\"));\n\nvar _MainContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MainContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue\"));\n\nvar _SearchBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/SearchBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\n__webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n// require('theme/assets/styles/main.scss');\n(function (Drupal, drupalSettings) {\n  var MaterioTheme = function MaterioTheme() {\n    var _v_user_block, _v_main_content, _v_search_block;\n\n    var _is_front = drupalSettings.path.isFront;\n    console.log('drupalSettings', drupalSettings); //  ___      _ _\n    // |_ _|_ _ (_) |_\n    //  | || ' \\| |  _|\n    // |___|_||_|_|\\__|\n\n    function init() {\n      console.log(\"MaterioTheme init()\");\n      initVues();\n    }\n\n    function initVues() {\n      initVUserBlock();\n      initVMainContent();\n      initVSearchBlock();\n    }\n\n    function initVUserBlock() {\n      var mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';\n      var props = {\n        title: \"\",\n        loginblock: \"\"\n      };\n\n      switch (mount_point) {\n        case 'block-userlogin':\n          var $block = document.getElementById(mount_point);\n          console.log('initVUserBlock login form html', $block);\n          props.loginblock = $block.outerHTML.trim();\n          break;\n\n        case 'block-userblock':\n        default:\n          break;\n      }\n\n      _v_user_block = new _vue.default({\n        store: _store.default,\n        // computed: {\n        //   ...mapState({\n        //     isloggedin: state => state.User.isloggedin\n        //   })\n        // },\n        created: function created() {\n          // if already loggedin, call store.user to get the user infos\n          if (drupalSettings.user.uid !== 0) {\n            this.$store.commit('User/setUid', drupalSettings.user.uid);\n            this.$store.dispatch('User/getUser');\n          }\n        },\n        render: function render(h) {\n          return h(_UserBlock.default, {\n            props: props\n          });\n        }\n      }).$mount('#' + mount_point); // console.log('initVUserBlock', _v_user_block);\n    }\n\n    function initVMainContent() {\n      var $main_content = document.querySelector('#main-content'); // console.log('main-content', $main_content);\n\n      var main_html = $main_content.innerHTML;\n      _v_main_content = new _vue.default({\n        store: _store.default,\n        render: function render(h) {\n          return h(_MainContent.default, {\n            props: {\n              html: main_html\n            }\n          });\n        }\n      }).$mount('#main-content'); // console.log('initTestVContent', v_test_content);\n    }\n\n    function initVSearchBlock() {\n      // console.log('initVSearchBlock');\n      var id = \"block-materiosapisearchblock\";\n      var $search_block = document.getElementById(id);\n      var formhtml = null;\n\n      if ($search_block) {\n        // get the search form html to pass it as template to the vue\n        // we gain display speed vs async downloaded data\n        formhtml = $search_block.innerHTML;\n      } else {\n        // else create the empty block to fill it later with async data\n        $search_block = document.createElement('div');\n        $search_block.setAttribute('id', id);\n        var $region = document.getElementById('content-top');\n        $region.appendChild($search_block);\n      } // in any case create the vue\n\n\n      _v_search_block = new _vue.default({\n        store: _store.default,\n        render: function render(h) {\n          return h(_SearchBlock.default, {\n            props: {\n              blockid: id,\n              formhtml: formhtml\n            }\n          });\n        }\n      }).$mount('#' + id);\n    }\n\n    init();\n  }; // end MaterioTheme()\n\n\n  var materiotheme = new MaterioTheme();\n})(Drupal, drupalSettings);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/scripts/main.js?");
+eval("\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _UserBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/UserBlock.vue\"));\n\nvar _MainContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MainContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue\"));\n\nvar _SearchBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/SearchBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\n__webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n// require('theme/assets/styles/main.scss');\n(function (Drupal, drupalSettings) {\n  var MaterioTheme = function MaterioTheme() {\n    var _v_sitebranding_block, _v_user_block, _v_main_content, _v_search_block;\n\n    var _is_front = drupalSettings.path.isFront;\n    console.log('drupalSettings', drupalSettings); //  ___      _ _\n    // |_ _|_ _ (_) |_\n    //  | || ' \\| |  _|\n    // |___|_||_|_|\\__|\n\n    function init() {\n      console.log(\"MaterioTheme init()\");\n      initVues();\n    }\n\n    function initVues() {\n      initVSiteBrandingBlock();\n      initVUserBlock();\n      initVMainContent();\n      initVSearchBlock();\n    }\n\n    function initVSiteBrandingBlock() {\n      _v_sitebranding_block = new _vue.default({\n        store: _store.default,\n        router: _route.default,\n        el: '#block-sitebranding',\n        methods: {\n          onclick: function onclick() {\n            console.log(\"Clicked on logo\");\n            this.$router.push({\n              name: 'home'\n            });\n          }\n        }\n      });\n    }\n\n    function initVUserBlock() {\n      var mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';\n      var props = {\n        title: \"\",\n        loginblock: \"\"\n      };\n\n      switch (mount_point) {\n        case 'block-userlogin':\n          var $block = document.getElementById(mount_point);\n          console.log('initVUserBlock login form html', $block);\n          props.loginblock = $block.outerHTML.trim();\n          break;\n\n        case 'block-userblock':\n        default:\n          break;\n      }\n\n      _v_user_block = new _vue.default({\n        store: _store.default,\n        // computed: {\n        //   ...mapState({\n        //     isloggedin: state => state.User.isloggedin\n        //   })\n        // },\n        created: function created() {\n          // if already loggedin, call store.user to get the user infos\n          if (drupalSettings.user.uid !== 0) {\n            this.$store.commit('User/setUid', drupalSettings.user.uid);\n            this.$store.dispatch('User/getUser');\n          }\n        },\n        render: function render(h) {\n          return h(_UserBlock.default, {\n            props: props\n          });\n        }\n      }).$mount('#' + mount_point); // console.log('initVUserBlock', _v_user_block);\n    }\n\n    function initVMainContent() {\n      var id = \"main-content\";\n      var $main_content = document.querySelector('#' + id); // console.log('main-content', $main_content);\n\n      var main_html = $main_content.innerHTML;\n      _v_main_content = new _vue.default({\n        store: _store.default,\n        render: function render(h) {\n          return h(_MainContent.default, {\n            props: {\n              id: id,\n              html: main_html\n            }\n          });\n        }\n      }).$mount('#' + id); // console.log('initTestVContent', v_test_content);\n    }\n\n    function initVSearchBlock() {\n      // console.log('initVSearchBlock');\n      var id = \"block-materiosapisearchblock\";\n      var $search_block = document.getElementById(id);\n      var formhtml = null;\n\n      if ($search_block) {\n        // get the search form html to pass it as template to the vue\n        // we gain display speed vs async downloaded data\n        formhtml = $search_block.innerHTML;\n      } else {\n        // else create the empty block to fill it later with async data\n        $search_block = document.createElement('div');\n        $search_block.setAttribute('id', id);\n        var $region = document.getElementById('content-top');\n        $region.appendChild($search_block);\n      } // in any case create the vue\n\n\n      _v_search_block = new _vue.default({\n        store: _store.default,\n        render: function render(h) {\n          return h(_SearchBlock.default, {\n            props: {\n              blockid: id,\n              formhtml: formhtml\n            }\n          });\n        }\n      }).$mount('#' + id);\n    }\n\n    init();\n  }; // end MaterioTheme()\n\n\n  var materiotheme = new MaterioTheme();\n})(Drupal, drupalSettings);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/scripts/main.js?");
 
 /***/ }),
 
@@ -889,6 +961,102 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _nod
 
 /***/ }),
 
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue":
+/*!**************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue ***!
+  \**************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Base_vue_vue_type_template_id_c60a80ae_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Base.vue?vue&type=template&id=c60a80ae&scoped=true& */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=template&id=c60a80ae&scoped=true&\");\n/* harmony import */ var _Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Base.vue?vue&type=script&lang=js& */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=script&lang=js&\");\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ \"./node_modules/vue-loader/lib/runtime/componentNormalizer.js\");\n\n\n\n\n\n/* normalize component */\n\nvar component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(\n  _Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n  _Base_vue_vue_type_template_id_c60a80ae_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"render\"],\n  _Base_vue_vue_type_template_id_c60a80ae_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"],\n  false,\n  null,\n  \"c60a80ae\",\n  null\n  \n)\n\n/* hot reload */\nif (false) { var api; }\ncomponent.options.__file = \"web/themes/custom/materiotheme/vuejs/components/Content/Base.vue\"\n/* harmony default export */ __webpack_exports__[\"default\"] = (component.exports);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=script&lang=js&":
+/*!***************************************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=script&lang=js& ***!
+  \***************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../node_modules/babel-loader/lib!../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Base.vue?vue&type=script&lang=js& */ \"./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=script&lang=js&\");\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n /* harmony default export */ __webpack_exports__[\"default\"] = (_node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a); \n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=template&id=c60a80ae&scoped=true&":
+/*!*********************************************************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=template&id=c60a80ae&scoped=true& ***!
+  \*********************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_template_id_c60a80ae_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Base.vue?vue&type=template&id=c60a80ae&scoped=true& */ \"./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?vue&type=template&id=c60a80ae&scoped=true&\");\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_template_id_c60a80ae_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"render\"]; });\n\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Base_vue_vue_type_template_id_c60a80ae_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"]; });\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue":
+/*!**************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue ***!
+  \**************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Card_vue_vue_type_template_id_0318fc68_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Card.vue?vue&type=template&id=0318fc68&scoped=true& */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=template&id=0318fc68&scoped=true&\");\n/* harmony import */ var _Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Card.vue?vue&type=script&lang=js& */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=script&lang=js&\");\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ \"./node_modules/vue-loader/lib/runtime/componentNormalizer.js\");\n\n\n\n\n\n/* normalize component */\n\nvar component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(\n  _Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n  _Card_vue_vue_type_template_id_0318fc68_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"render\"],\n  _Card_vue_vue_type_template_id_0318fc68_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"],\n  false,\n  null,\n  \"0318fc68\",\n  null\n  \n)\n\n/* hot reload */\nif (false) { var api; }\ncomponent.options.__file = \"web/themes/custom/materiotheme/vuejs/components/Content/Card.vue\"\n/* harmony default export */ __webpack_exports__[\"default\"] = (component.exports);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=script&lang=js&":
+/*!***************************************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=script&lang=js& ***!
+  \***************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../node_modules/babel-loader/lib!../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Card.vue?vue&type=script&lang=js& */ \"./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=script&lang=js&\");\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n /* harmony default export */ __webpack_exports__[\"default\"] = (_node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a); \n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=template&id=0318fc68&scoped=true&":
+/*!*********************************************************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=template&id=0318fc68&scoped=true& ***!
+  \*********************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_template_id_0318fc68_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Card.vue?vue&type=template&id=0318fc68&scoped=true& */ \"./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?vue&type=template&id=0318fc68&scoped=true&\");\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_template_id_0318fc68_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"render\"]; });\n\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Card_vue_vue_type_template_id_0318fc68_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"]; });\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue":
+/*!**************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue ***!
+  \**************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Home.vue?vue&type=script&lang=js& */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?vue&type=script&lang=js&\");\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ \"./node_modules/vue-loader/lib/runtime/componentNormalizer.js\");\nvar render, staticRenderFns\n\n\n\n\n/* normalize component */\n\nvar component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_1__[\"default\"])(\n  _Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[\"default\"],\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"32c81292\",\n  null\n  \n)\n\n/* hot reload */\nif (false) { var api; }\ncomponent.options.__file = \"web/themes/custom/materiotheme/vuejs/components/Content/Home.vue\"\n/* harmony default export */ __webpack_exports__[\"default\"] = (component.exports);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?");
+
+/***/ }),
+
+/***/ "./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?vue&type=script&lang=js&":
+/*!***************************************************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?vue&type=script&lang=js& ***!
+  \***************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../node_modules/babel-loader/lib!../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Home.vue?vue&type=script&lang=js& */ \"./node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?vue&type=script&lang=js&\");\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n /* harmony default export */ __webpack_exports__[\"default\"] = (_node_modules_babel_loader_lib_index_js_node_modules_vue_loader_lib_index_js_vue_loader_options_Home_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a); \n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue?");
+
+/***/ }),
+
 /***/ "./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue":
 /*!*********************************************************************************!*\
   !*** ./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue ***!
@@ -997,6 +1165,18 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _nod
 
 /***/ }),
 
+/***/ "./web/themes/custom/materiotheme/vuejs/route/index.js":
+/*!*************************************************************!*\
+  !*** ./web/themes/custom/materiotheme/vuejs/route/index.js ***!
+  \*************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _vueRouter = _interopRequireDefault(__webpack_require__(/*! vue-router */ \"./node_modules/vue-router/dist/vue-router.esm.js\"));\n\nvar _Home = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Home */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Home.vue\"));\n\nvar _Base = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Base */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n_vue.default.use(_vueRouter.default);\n\nvar _default = new _vueRouter.default({\n  routes: [{\n    path: '/',\n    name: 'home',\n    components: {\n      'home': _Home.default\n    }\n  }, {\n    path: '/base',\n    name: 'base',\n    components: {\n      'base': _Base.default\n    }\n  }]\n});\n\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/route/index.js?");
+
+/***/ }),
+
 /***/ "./web/themes/custom/materiotheme/vuejs/store/index.js":
 /*!*************************************************************!*\
   !*** ./web/themes/custom/materiotheme/vuejs/store/index.js ***!
@@ -1017,7 +1197,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _jsonAxios = __webpack_require__(/*! vuejs/api/json-axios */ \"./web/themes/custom/materiotheme/vuejs/api/json-axios.js\");\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nvar _querystring = _interopRequireDefault(__webpack_require__(/*! querystring */ \"./node_modules/querystring-es3/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar _default = {\n  namespaced: true,\n  // initial state\n  state: {\n    keys: \"\",\n    autocomplete: \"\",\n    results: {}\n  },\n  // getters\n  getters: {},\n  // mutations\n  mutations: {\n    setResults: function setResults(state, data) {\n      state.results = data.results;\n    },\n    setKeys: function setKeys(state, keys) {\n      state.keys = keys;\n    },\n    setAutocomplete: function setAutocomplete(state, autocomplete) {\n      state.autocomplete = autocomplete;\n    }\n  },\n  // actions\n  actions: {\n    getResults: function getResults(_ref) {\n      var dispatch = _ref.dispatch,\n          commit = _ref.commit,\n          state = _ref.state;\n      var params = {\n        keys: state.keys,\n        autocomplete: state.autocomplete,\n        offset: 0,\n        limit: 25\n      };\n      console.log('Search getResults params', params);\n\n      var q = _querystring.default.stringify(params);\n\n      return _maAxios.MA.get(\"/materio_sapi/getresults?\" + q).then(function (_ref2) {\n        var data = _ref2.data;\n        console.log('search MA getresults data', data);\n        commit('setResults', data);\n      }).catch(function (error) {\n        console.warn('Issue with getResults', error);\n        Promise.reject(error);\n      });\n    }\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/store/modules/search.js?");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _jsonAxios = __webpack_require__(/*! vuejs/api/json-axios */ \"./web/themes/custom/materiotheme/vuejs/api/json-axios.js\");\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nvar _querystring = _interopRequireDefault(__webpack_require__(/*! querystring */ \"./node_modules/querystring-es3/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar _default = {\n  namespaced: true,\n  // initial state\n  state: {\n    keys: \"\",\n    autocomplete: \"\",\n    items: [],\n    limit: 15,\n    offset: 0\n  },\n  // getters\n  getters: {},\n  // mutations\n  mutations: {\n    setItems: function setItems(state, items) {\n      state.items = items;\n    },\n    setKeys: function setKeys(state, keys) {\n      state.keys = keys;\n    },\n    setAutocomplete: function setAutocomplete(state, autocomplete) {\n      state.autocomplete = autocomplete;\n    },\n    resetOffset: function resetOffset(state) {\n      state.offset = 0;\n    },\n    incrementOffset: function incrementOffset(state) {\n      state.offset += state.limit;\n    }\n  },\n  // actions\n  actions: {\n    newSearch: function newSearch(_ref, keys, autocomplete) {\n      var dispatch = _ref.dispatch,\n          commit = _ref.commit,\n          state = _ref.state;\n      commit('resetOffset');\n      commit('setKeys', keys);\n      commit('setAutocomplete', autocomplete);\n      dispatch('getResults');\n    },\n    getResults: function getResults(_ref2) {\n      var dispatch = _ref2.dispatch,\n          commit = _ref2.commit,\n          state = _ref2.state;\n      var params = {\n        keys: state.keys,\n        autocomplete: state.autocomplete,\n        offset: state.offset,\n        limit: state.limit\n      };\n      console.log('Search getResults params', params);\n\n      var q = _querystring.default.stringify(params);\n\n      return _maAxios.MA.get(\"/materio_sapi/getresults?\" + q).then(function (_ref3) {\n        var data = _ref3.data;\n        console.log('search MA getresults data', data);\n        commit('setItems', data.items);\n      }).catch(function (error) {\n        console.warn('Issue with getResults', error);\n        Promise.reject(error);\n      });\n    }\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/store/modules/search.js?");
 
 /***/ }),
 
diff --git a/web/themes/custom/materiotheme/assets/scripts/main.js b/web/themes/custom/materiotheme/assets/scripts/main.js
index 531513e..9ad5077 100644
--- a/web/themes/custom/materiotheme/assets/scripts/main.js
+++ b/web/themes/custom/materiotheme/assets/scripts/main.js
@@ -1,6 +1,7 @@
 import Vue from 'vue'
 
 import store from 'vuejs/store'
+import router from 'vuejs/route'
 
 import VUserBlock from 'vuejs/components/Block/UserBlock'
 import VMainContent from 'vuejs/components/Content/MainContent'
@@ -15,7 +16,7 @@ import 'theme/assets/styles/main.scss'
 
   var MaterioTheme = function(){
 
-    var _v_user_block, _v_main_content, _v_search_block;
+    var _v_sitebranding_block, _v_user_block, _v_main_content, _v_search_block;
     var _is_front = drupalSettings.path.isFront;
 
     console.log('drupalSettings', drupalSettings);
@@ -30,11 +31,26 @@ import 'theme/assets/styles/main.scss'
     }
 
     function initVues(){
+      initVSiteBrandingBlock()
       initVUserBlock()
       initVMainContent()
       initVSearchBlock()
     }
 
+    function initVSiteBrandingBlock(){
+      _v_sitebranding_block = new Vue({
+        store,
+        router,
+        el: '#block-sitebranding',
+        methods: {
+          onclick(){
+            console.log("Clicked on logo");
+            this.$router.push({name:'home'})
+          }
+        }
+      })
+    }
+
     function initVUserBlock(){
       let mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';
       let props = {
@@ -72,13 +88,14 @@ import 'theme/assets/styles/main.scss'
     }
 
     function initVMainContent(){
-      let $main_content = document.querySelector('#main-content')
+      let id = "main-content"
+      let $main_content = document.querySelector('#'+id)
       // console.log('main-content', $main_content);
       let main_html = $main_content.innerHTML
       _v_main_content = new Vue({
         store,
-        render: h => h(VMainContent, {props:{html:main_html}})
-      }).$mount('#main-content')
+        render: h => h(VMainContent, {props:{id:id, html:main_html}})
+      }).$mount('#'+id)
       // console.log('initTestVContent', v_test_content);
     }
 
diff --git a/web/themes/custom/materiotheme/templates/block/block--system-branding-block.html.twig b/web/themes/custom/materiotheme/templates/block/block--system-branding-block.html.twig
index 4068220..8e9e9de 100644
--- a/web/themes/custom/materiotheme/templates/block/block--system-branding-block.html.twig
+++ b/web/themes/custom/materiotheme/templates/block/block--system-branding-block.html.twig
@@ -19,7 +19,7 @@
   <hgroup class="logo">
     {% if site_name %}
       <h1>
-        <a href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home">
+        <a @click.prevent="onclick" href="{{ path('<front>') }}" title="{{ 'Home'|t }}" rel="home">
           {{ site_name }}
         </a>
       </h1>
diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue
new file mode 100644
index 0000000..3c3f8f6
--- /dev/null
+++ b/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue
@@ -0,0 +1,40 @@
+<template>
+  <div id="Base">
+    <h1>Base</h1>
+    <div class="results">
+      <ul>
+        <li v-for="item in items" v-bind:key="item.nid">
+          <Card :item="item"/>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+
+<script>
+
+import Card from 'vuejs/components/Content/Card'
+
+import { mapState, mapActions } from 'vuex'
+
+export default {
+  name: "Base",
+  data: () => ({
+
+  }),
+  computed: {
+    ...mapState({
+      items: state => state.Search.items
+    })
+  },
+  components: {
+    Card
+  }
+
+}
+
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue
new file mode 100644
index 0000000..6407847
--- /dev/null
+++ b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue
@@ -0,0 +1,20 @@
+<template>
+  <div class="card">
+    <h1>{{ item.title }}</h1>
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "Card",
+  props: ['item'],
+  data: () => ({
+
+  })
+}
+
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Home.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Home.vue
new file mode 100644
index 0000000..dc4c0b5
--- /dev/null
+++ b/web/themes/custom/materiotheme/vuejs/components/Content/Home.vue
@@ -0,0 +1,55 @@
+
+<script>
+
+import Vue from 'vue'
+import { MA } from 'vuejs/api/ma-axios'
+
+export default {
+  props: ['html'], // get the html from parent with props
+  data() {
+    return {
+      template_src: null, // record the prop into data as it will be available in every hooks
+      template: null // compiled template from html used in render
+    }
+  },
+  beforeMount() {
+    // console.log('Home beforeMount this.html', this.html);
+    if(!this.template_src){
+      if(this.html){ // if html prop is available record it has data
+        this.template_src = this.html
+      }else{ // else get it from ajax (e.g. if we didn't load the page from home)
+        this.getHomeHtml()
+      }
+    }
+    // compile the html src (coming from parent with props or from ajax call)
+    if(this.template_src){
+      this.template = Vue.compile(this.template_src)
+      this.$options.staticRenderFns = []
+      this._staticTrees = []
+      this.template.staticRenderFns.map(fn => (this.$options.staticRenderFns.push(fn)))
+    }
+  },
+  methods: {
+    getHomeHtml(){
+      MA.get(`/materio_user/login_block`)
+        .then(({data}) => {
+          this.template_src = data.rendered // record the html src into data
+        })
+        .catch(( error ) => {
+          console.warn('Issue with getHomeHtml', error)
+        })
+    }
+  },
+  render(h) {
+    if(!this.template){
+      return h('span', 'Loading ...')
+    }else{
+      return this.template.render.call(this)
+    }
+  }
+}
+
+</script>
+
+<style lang="scss" scoped>
+</style>
diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.back.vue b/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.back.vue
new file mode 100644
index 0000000..ef1242b
--- /dev/null
+++ b/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.back.vue
@@ -0,0 +1,21 @@
+<template lang="html">
+  <div id="main-content" v-html="html"></div>
+</template>
+
+<script>
+import { mapState, mapActions } from 'vuex'
+
+export default {
+  props:['html'],
+  computed: {
+    ...mapState({
+      token: state => state.User.token,
+      isloggedin: state => state.User.isloggedin
+    })
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>
diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue b/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue
index ef1242b..f5cf55d 100644
--- a/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue
+++ b/web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue
@@ -1,18 +1,30 @@
 <template lang="html">
-  <div id="main-content" v-html="html"></div>
+  <div :id="id">
+    <router-view name="home" :html="html"></router-view>
+    <router-view name="base"></router-view>
+  </div>
 </template>
 
 <script>
 import { mapState, mapActions } from 'vuex'
 
+import router from 'vuejs/route'
+
 export default {
-  props:['html'],
-  computed: {
-    ...mapState({
-      token: state => state.User.token,
-      isloggedin: state => state.User.isloggedin
-    })
-  }
+  router,
+  props:['id','html']
+  // computed: {
+  //   ...mapState({
+  //     token: state => state.User.token,
+  //     isloggedin: state => state.User.isloggedin
+  //   })
+  // },
+  // beforeMount() {
+  //   console.log('MainContent beforeMount this.html', this.html);
+  // },
+  // mounted() {
+  //   console.log('MainContent this.$router', this.$router);
+  // }
 }
 </script>
 
diff --git a/web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue b/web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue
index 09ccbf6..bc37a84 100644
--- a/web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue
+++ b/web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue
@@ -2,48 +2,30 @@
 
 import Vue from 'vue'
 
+import router from 'vuejs/route'
+
 import { mapState, mapActions } from 'vuex'
 
 export default {
+  router,
   props: ['form'],
   data() {
     return {
-      template: null
-      // keys: "",
-      // autocomplete: ""
+      template: null,
+      keys: "",
+      autocomplete: ""
     }
   },
-  computed: {
-    // ...mapState(['Search'])
-    // ...mapState({
-    //   // keys: state => state.Search.keys,
-    //   autocomplete: state => state.Search.autocomplete
-    // }),
-    keys: {
-      get(){
-        return this.$store.state.Search.keys
-      },
-      set(value){
-        this.$store.commit('Search/setKeys', value)
-      }
-    },
-    autocomplete: {
-      get(){
-        return this.$store.state.Search.autocomplete
-      },
-      set(value){
-        this.$store.commit('Search/setAutocomplete', value)
-      }
-    }
-
-  },
   methods: {
     ...mapActions({
-      getResults: 'Search/getResults'
+      newSearch: 'Search/newSearch'
     }),
     submit() {
       console.log("search clicked", this.keys, this.autocomplete);
-      this.getResults();
+      this.newSearch(this.keys, this.autocomplete)
+        .then(() => {
+          this.$router.push({name:'base'})
+        });
     },
     onAutoCompleteSelect(event, ui){
       event.preventDefault();
diff --git a/web/themes/custom/materiotheme/vuejs/route/index.js b/web/themes/custom/materiotheme/vuejs/route/index.js
new file mode 100644
index 0000000..751c0e8
--- /dev/null
+++ b/web/themes/custom/materiotheme/vuejs/route/index.js
@@ -0,0 +1,26 @@
+import Vue from 'vue'
+import VueRouter from 'vue-router'
+
+import Home from 'vuejs/components/Content/Home'
+import Base from 'vuejs/components/Content/Base'
+
+Vue.use(VueRouter)
+
+export default new VueRouter({
+  routes: [
+    {
+      path: '/',
+      name: 'home',
+      components: {
+        'home': Home
+      }
+    },
+    {
+      path: '/base',
+      name:'base',
+      components: {
+        'base': Base
+      }
+    },
+  ]
+})
diff --git a/web/themes/custom/materiotheme/vuejs/store/modules/search.js b/web/themes/custom/materiotheme/vuejs/store/modules/search.js
index 1ee6ec8..959083a 100644
--- a/web/themes/custom/materiotheme/vuejs/store/modules/search.js
+++ b/web/themes/custom/materiotheme/vuejs/store/modules/search.js
@@ -9,7 +9,9 @@ export default {
   state : {
     keys: "",
     autocomplete: "",
-    results: {}
+    items: [],
+    limit: 15,
+    offset: 0
   },
 
   // getters
@@ -17,32 +19,44 @@ export default {
 
   // mutations
   mutations : {
-    setResults (state, data) {
-      state.results = data.results
+    setItems (state, items) {
+      state.items = items
     },
     setKeys (state, keys) {
       state.keys = keys
     },
     setAutocomplete (state, autocomplete) {
       state.autocomplete = autocomplete
+    },
+    resetOffset(state) {
+      state.offset = 0
+    },
+    incrementOffset(state) {
+      state.offset += state.limit
     }
   },
 
   // actions
   actions : {
+    newSearch({ dispatch, commit, state }, keys, autocomplete) {
+      commit('resetOffset')
+      commit('setKeys', keys)
+      commit('setAutocomplete', autocomplete)
+      dispatch('getResults')
+    },
     getResults ({ dispatch, commit, state }) {
       let params = {
         keys: state.keys,
         autocomplete: state.autocomplete,
-        offset:0,
-        limit: 25
+        offset:state.offset,
+        limit: state.limit
       }
       console.log('Search getResults params', params);
       let q = qs.stringify(params)
       return MA.get(`/materio_sapi/getresults?`+q)
         .then(({ data }) => {
           console.log('search MA getresults data', data)
-          commit('setResults', data)
+          commit('setItems', data.items)
         })
         .catch(( error ) => {
             console.warn('Issue with getResults', error)