mirror of
https://github.com/tenrok/vue-context.git
synced 2026-06-23 02:00:32 +03:00
wip
This commit is contained in:
rawilk
@@ -47,44 +47,44 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import VueContext from 'vue-context';
|
import VueContext from 'vue-context';
|
||||||
import 'vue-context/src/sass/vue-context.scss';
|
import 'vue-context/src/sass/vue-context.scss';
|
||||||
|
|
||||||
const items = [
|
const items = [
|
||||||
'Cras justo odio',
|
'Cras justo odio',
|
||||||
'Dapibus ac facilisis in',
|
'Dapibus ac facilisis in',
|
||||||
'Morbi leo risus',
|
'Morbi leo risus',
|
||||||
'Porta ac consectetur ac',
|
'Porta ac consectetur ac',
|
||||||
'Vestibulum at eros'
|
'Vestibulum at eros'
|
||||||
];
|
];
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { VueContext },
|
components: { VueContext },
|
||||||
|
|
||||||
computed: {
|
computed: {
|
||||||
showReset () {
|
showReset () {
|
||||||
return this.items.length < items.length;
|
return this.items.length < items.length;
|
||||||
},
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
items: [...items]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
alertName(name) {
|
||||||
|
alert(`You clicked on "${name}"!`);
|
||||||
},
|
},
|
||||||
|
|
||||||
data () {
|
remove(index) {
|
||||||
return {
|
this.$delete(this.items, index);
|
||||||
items: [...items]
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
reset() {
|
||||||
alertName(name) {
|
this.items = [...items];
|
||||||
alert(`You clicked on "${name}"!`);
|
|
||||||
},
|
|
||||||
|
|
||||||
remove(index) {
|
|
||||||
this.$delete(this.items, index);
|
|
||||||
},
|
|
||||||
|
|
||||||
reset() {
|
|
||||||
this.items = [...items];
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
};
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
import Vue from 'vue';
|
||||||
|
import Advanced1 from './advanced-1';
|
||||||
|
import Advanced2 from './advanced-2';
|
||||||
|
|
||||||
|
// Need a separate vue app for each of these so we can render the markdown properly.
|
||||||
|
new Vue({
|
||||||
|
components: {
|
||||||
|
Advanced1,
|
||||||
|
},
|
||||||
|
}).$mount('#advanced-1-app');
|
||||||
|
|
||||||
|
new Vue({
|
||||||
|
components: {
|
||||||
|
Advanced2,
|
||||||
|
},
|
||||||
|
}).$mount('#advanced-2-app');
|
||||||
@@ -1,7 +1,6 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import BasicUsage from './basic-usage';
|
import BasicUsage from './basic-usage';
|
||||||
import Advanced1 from './advanced-1';
|
|
||||||
import Advanced2 from './advanced-2';
|
|
||||||
import NestedMenus from './nested-menus';
|
import NestedMenus from './nested-menus';
|
||||||
import CloseOnClick from './close-on-click';
|
import CloseOnClick from './close-on-click';
|
||||||
import CloseOnScroll from './close-on-scroll';
|
import CloseOnScroll from './close-on-scroll';
|
||||||
@@ -9,8 +8,7 @@ import CloseOnScroll from './close-on-scroll';
|
|||||||
new Vue({
|
new Vue({
|
||||||
components: {
|
components: {
|
||||||
BasicUsage,
|
BasicUsage,
|
||||||
Advanced1,
|
|
||||||
Advanced2,
|
|
||||||
NestedMenus,
|
NestedMenus,
|
||||||
CloseOnClick,
|
CloseOnClick,
|
||||||
CloseOnScroll,
|
CloseOnScroll,
|
||||||
|
|||||||
@@ -1,4 +1,8 @@
|
|||||||
const mix = require('laravel-mix');
|
const mix = require('laravel-mix');
|
||||||
|
|
||||||
mix.js('js/index.js', 'dist/vue-context-demos.js')
|
mix
|
||||||
.copy('dist/vue-context-demos.js', __dirname + '/../docs/scripts');
|
.js('js/index.js', 'dist/vue-context-demos.js')
|
||||||
|
.js('js/advanced/index.js', 'dist/vue-context-advanced-demos.js')
|
||||||
|
|
||||||
|
.copy('dist/vue-context-demos.js', __dirname + '/../docs/scripts')
|
||||||
|
.copy('dist/vue-context-advanced-demos.js', __dirname + '/../docs/scripts');
|
||||||
|
|||||||
+97
-5
@@ -3,16 +3,108 @@ title: Advanced Demo
|
|||||||
sort: 2
|
sort: 2
|
||||||
---
|
---
|
||||||
|
|
||||||
<div id="app">
|
|
||||||
## Demo 1
|
## Demo 1
|
||||||
|
|
||||||
{.tip}
|
{.tip}
|
||||||
> Right click on each item to see a more customized context menu appear for each item.
|
> Right click on each item to see a more customized context menu appear for each item.
|
||||||
|
|
||||||
<div style="margin-bottom: 1rem;">
|
<div id="advanced-1-app">
|
||||||
<advanced-1></advanced-1>
|
<div style="margin-bottom: 1rem;">
|
||||||
|
<advanced-1></advanced-1>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
```html
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="bg-white shadow overflow-hidden sm:rounded-md">
|
||||||
|
<ul class="demo">
|
||||||
|
<li>
|
||||||
|
<a href="#"
|
||||||
|
class="block hover:bg-gray-50 focus:outline-none focus:bg-gray-50 transition duration-150 ease-in-out"
|
||||||
|
:class="{ 'border-t border-gray-200': index > 0 }"
|
||||||
|
v-for="(item, index) in items"
|
||||||
|
:key="index"
|
||||||
|
@contextmenu.prevent="$refs.menu.open($event, { name: item, index })"
|
||||||
|
>
|
||||||
|
<div class="flex items-center px-4 py-4 sm:px-6">
|
||||||
|
<div class="min-w-0 flex-1 md:grid md:grid-cols-2 md:gap-4">
|
||||||
|
<div class="text-sm leading-5 font-medium text-gray-600 truncate" v-text="item"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
<script src="../scripts/vue-context-demos.js"></script>
|
<div class="my-4 text-right" v-show="showReset">
|
||||||
|
<button type="button"
|
||||||
|
class="inline-flex items-center px-4 py-2 border border-transparent text-sm leading-5 font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-50 focus:outline-none focus:border-indigo-300 focus:shadow-outline-indigo active:bg-indigo-200 transition ease-in-out duration-150"
|
||||||
|
@click="reset"
|
||||||
|
>
|
||||||
|
Reset Demo
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<vue-context ref="menu" v-slot="{ data }">
|
||||||
|
<template v-if="data">
|
||||||
|
<li>
|
||||||
|
<a @click.prevent="alertName(data.name)">
|
||||||
|
Alert name
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a @click.prevent="remove(data.index)">
|
||||||
|
Delete "{{ data.name }}"
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</template>
|
||||||
|
</vue-context>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import VueContext from 'vue-context';
|
||||||
|
import 'vue-context/src/sass/vue-context.scss';
|
||||||
|
|
||||||
|
const items = [
|
||||||
|
'Cras justo odio',
|
||||||
|
'Dapibus ac facilisis in',
|
||||||
|
'Morbi leo risus',
|
||||||
|
'Porta ac consectetur ac',
|
||||||
|
'Vestibulum at eros'
|
||||||
|
];
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { VueContext },
|
||||||
|
|
||||||
|
computed: {
|
||||||
|
showReset () {
|
||||||
|
return this.items.length < items.length;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
items: [...items]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
alertName(name) {
|
||||||
|
alert(`You clicked on "${name}"!`);
|
||||||
|
},
|
||||||
|
|
||||||
|
remove(index) {
|
||||||
|
this.$delete(this.items, index);
|
||||||
|
},
|
||||||
|
|
||||||
|
reset() {
|
||||||
|
this.items = [...items];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
```
|
||||||
|
|
||||||
|
<script src="../scripts/vue-context-advanced-demos.js"></script>
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -86,162 +86,6 @@
|
|||||||
/************************************************************************/
|
/************************************************************************/
|
||||||
/******/ ({
|
/******/ ({
|
||||||
|
|
||||||
/***/ "./js/advanced-1.vue":
|
|
||||||
/*!***************************!*\
|
|
||||||
!*** ./js/advanced-1.vue ***!
|
|
||||||
\***************************/
|
|
||||||
/*! exports provided: default */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _advanced_1_vue_vue_type_template_id_d95475a4___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./advanced-1.vue?vue&type=template&id=d95475a4& */ "./js/advanced-1.vue?vue&type=template&id=d95475a4&");
|
|
||||||
/* harmony import */ var _advanced_1_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./advanced-1.vue?vue&type=script&lang=js& */ "./js/advanced-1.vue?vue&type=script&lang=js&");
|
|
||||||
/* empty/unused harmony star reexport *//* 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");
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* normalize component */
|
|
||||||
|
|
||||||
var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__["default"])(
|
|
||||||
_advanced_1_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
|
|
||||||
_advanced_1_vue_vue_type_template_id_d95475a4___WEBPACK_IMPORTED_MODULE_0__["render"],
|
|
||||||
_advanced_1_vue_vue_type_template_id_d95475a4___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
|
|
||||||
false,
|
|
||||||
null,
|
|
||||||
null,
|
|
||||||
null
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
/* hot reload */
|
|
||||||
if (false) { var api; }
|
|
||||||
component.options.__file = "js/advanced-1.vue"
|
|
||||||
/* harmony default export */ __webpack_exports__["default"] = (component.exports);
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/advanced-1.vue?vue&type=script&lang=js&":
|
|
||||||
/*!****************************************************!*\
|
|
||||||
!*** ./js/advanced-1.vue?vue&type=script&lang=js& ***!
|
|
||||||
\****************************************************/
|
|
||||||
/*! exports provided: default */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_1_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../node_modules/babel-loader/lib??ref--4-0!../node_modules/vue-loader/lib??vue-loader-options!./advanced-1.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-1.vue?vue&type=script&lang=js&");
|
|
||||||
/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_1_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]);
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/advanced-1.vue?vue&type=template&id=d95475a4&":
|
|
||||||
/*!**********************************************************!*\
|
|
||||||
!*** ./js/advanced-1.vue?vue&type=template&id=d95475a4& ***!
|
|
||||||
\**********************************************************/
|
|
||||||
/*! exports provided: render, staticRenderFns */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_1_vue_vue_type_template_id_d95475a4___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!./advanced-1.vue?vue&type=template&id=d95475a4& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-1.vue?vue&type=template&id=d95475a4&");
|
|
||||||
/* 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_advanced_1_vue_vue_type_template_id_d95475a4___WEBPACK_IMPORTED_MODULE_0__["render"]; });
|
|
||||||
|
|
||||||
/* 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_advanced_1_vue_vue_type_template_id_d95475a4___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/advanced-2.vue":
|
|
||||||
/*!***************************!*\
|
|
||||||
!*** ./js/advanced-2.vue ***!
|
|
||||||
\***************************/
|
|
||||||
/*! exports provided: default */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _advanced_2_vue_vue_type_template_id_d93846a2_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./advanced-2.vue?vue&type=template&id=d93846a2&scoped=true& */ "./js/advanced-2.vue?vue&type=template&id=d93846a2&scoped=true&");
|
|
||||||
/* harmony import */ var _advanced_2_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./advanced-2.vue?vue&type=script&lang=js& */ "./js/advanced-2.vue?vue&type=script&lang=js&");
|
|
||||||
/* empty/unused harmony star reexport *//* harmony import */ var _advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true& */ "./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true&");
|
|
||||||
/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ "./node_modules/vue-loader/lib/runtime/componentNormalizer.js");
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* normalize component */
|
|
||||||
|
|
||||||
var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__["default"])(
|
|
||||||
_advanced_2_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
|
|
||||||
_advanced_2_vue_vue_type_template_id_d93846a2_scoped_true___WEBPACK_IMPORTED_MODULE_0__["render"],
|
|
||||||
_advanced_2_vue_vue_type_template_id_d93846a2_scoped_true___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
|
|
||||||
false,
|
|
||||||
null,
|
|
||||||
"d93846a2",
|
|
||||||
null
|
|
||||||
|
|
||||||
)
|
|
||||||
|
|
||||||
/* hot reload */
|
|
||||||
if (false) { var api; }
|
|
||||||
component.options.__file = "js/advanced-2.vue"
|
|
||||||
/* harmony default export */ __webpack_exports__["default"] = (component.exports);
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/advanced-2.vue?vue&type=script&lang=js&":
|
|
||||||
/*!****************************************************!*\
|
|
||||||
!*** ./js/advanced-2.vue?vue&type=script&lang=js& ***!
|
|
||||||
\****************************************************/
|
|
||||||
/*! exports provided: default */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../node_modules/babel-loader/lib??ref--4-0!../node_modules/vue-loader/lib??vue-loader-options!./advanced-2.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=script&lang=js&");
|
|
||||||
/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]);
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true&":
|
|
||||||
/*!*************************************************************************************!*\
|
|
||||||
!*** ./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true& ***!
|
|
||||||
\*************************************************************************************/
|
|
||||||
/*! no static exports found */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _node_modules_style_loader_index_js_node_modules_css_loader_index_js_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_2_node_modules_sass_loader_dist_cjs_js_ref_6_3_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../node_modules/style-loader!../node_modules/css-loader!../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../node_modules/postcss-loader/src??ref--6-2!../node_modules/sass-loader/dist/cjs.js??ref--6-3!../node_modules/vue-loader/lib??vue-loader-options!./advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true& */ "./node_modules/style-loader/index.js!./node_modules/css-loader/index.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true&");
|
|
||||||
/* harmony import */ var _node_modules_style_loader_index_js_node_modules_css_loader_index_js_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_2_node_modules_sass_loader_dist_cjs_js_ref_6_3_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_index_js_node_modules_css_loader_index_js_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_2_node_modules_sass_loader_dist_cjs_js_ref_6_3_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__);
|
|
||||||
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_style_loader_index_js_node_modules_css_loader_index_js_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_2_node_modules_sass_loader_dist_cjs_js_ref_6_3_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_style_loader_index_js_node_modules_css_loader_index_js_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_2_node_modules_sass_loader_dist_cjs_js_ref_6_3_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
|
|
||||||
/* harmony default export */ __webpack_exports__["default"] = (_node_modules_style_loader_index_js_node_modules_css_loader_index_js_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_2_node_modules_sass_loader_dist_cjs_js_ref_6_3_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_style_index_0_id_d93846a2_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default.a);
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/advanced-2.vue?vue&type=template&id=d93846a2&scoped=true&":
|
|
||||||
/*!**********************************************************************!*\
|
|
||||||
!*** ./js/advanced-2.vue?vue&type=template&id=d93846a2&scoped=true& ***!
|
|
||||||
\**********************************************************************/
|
|
||||||
/*! exports provided: render, staticRenderFns */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_advanced_2_vue_vue_type_template_id_d93846a2_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!./advanced-2.vue?vue&type=template&id=d93846a2&scoped=true& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=template&id=d93846a2&scoped=true&");
|
|
||||||
/* 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_advanced_2_vue_vue_type_template_id_d93846a2_scoped_true___WEBPACK_IMPORTED_MODULE_0__["render"]; });
|
|
||||||
|
|
||||||
/* 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_advanced_2_vue_vue_type_template_id_d93846a2_scoped_true___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./js/basic-usage.vue":
|
/***/ "./js/basic-usage.vue":
|
||||||
/*!****************************!*\
|
/*!****************************!*\
|
||||||
!*** ./js/basic-usage.vue ***!
|
!*** ./js/basic-usage.vue ***!
|
||||||
@@ -461,13 +305,9 @@ __webpack_require__.r(__webpack_exports__);
|
|||||||
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.common.js");
|
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.common.js");
|
||||||
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
|
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(vue__WEBPACK_IMPORTED_MODULE_0__);
|
||||||
/* harmony import */ var _basic_usage__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./basic-usage */ "./js/basic-usage.vue");
|
/* harmony import */ var _basic_usage__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./basic-usage */ "./js/basic-usage.vue");
|
||||||
/* harmony import */ var _advanced_1__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./advanced-1 */ "./js/advanced-1.vue");
|
/* harmony import */ var _nested_menus__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./nested-menus */ "./js/nested-menus.vue");
|
||||||
/* harmony import */ var _advanced_2__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./advanced-2 */ "./js/advanced-2.vue");
|
/* harmony import */ var _close_on_click__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./close-on-click */ "./js/close-on-click.vue");
|
||||||
/* harmony import */ var _nested_menus__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./nested-menus */ "./js/nested-menus.vue");
|
/* harmony import */ var _close_on_scroll__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./close-on-scroll */ "./js/close-on-scroll.vue");
|
||||||
/* harmony import */ var _close_on_click__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./close-on-click */ "./js/close-on-click.vue");
|
|
||||||
/* harmony import */ var _close_on_scroll__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./close-on-scroll */ "./js/close-on-scroll.vue");
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -476,11 +316,9 @@ __webpack_require__.r(__webpack_exports__);
|
|||||||
new vue__WEBPACK_IMPORTED_MODULE_0___default.a({
|
new vue__WEBPACK_IMPORTED_MODULE_0___default.a({
|
||||||
components: {
|
components: {
|
||||||
BasicUsage: _basic_usage__WEBPACK_IMPORTED_MODULE_1__["default"],
|
BasicUsage: _basic_usage__WEBPACK_IMPORTED_MODULE_1__["default"],
|
||||||
Advanced1: _advanced_1__WEBPACK_IMPORTED_MODULE_2__["default"],
|
NestedMenus: _nested_menus__WEBPACK_IMPORTED_MODULE_2__["default"],
|
||||||
Advanced2: _advanced_2__WEBPACK_IMPORTED_MODULE_3__["default"],
|
CloseOnClick: _close_on_click__WEBPACK_IMPORTED_MODULE_3__["default"],
|
||||||
NestedMenus: _nested_menus__WEBPACK_IMPORTED_MODULE_4__["default"],
|
CloseOnScroll: _close_on_scroll__WEBPACK_IMPORTED_MODULE_4__["default"]
|
||||||
CloseOnClick: _close_on_click__WEBPACK_IMPORTED_MODULE_5__["default"],
|
|
||||||
CloseOnScroll: _close_on_scroll__WEBPACK_IMPORTED_MODULE_6__["default"]
|
|
||||||
}
|
}
|
||||||
}).$mount('#app');
|
}).$mount('#app');
|
||||||
|
|
||||||
@@ -553,191 +391,6 @@ __webpack_require__.r(__webpack_exports__);
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-1.vue?vue&type=script&lang=js&":
|
|
||||||
/*!************************************************************************************************************************************************!*\
|
|
||||||
!*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./js/advanced-1.vue?vue&type=script&lang=js& ***!
|
|
||||||
\************************************************************************************************************************************************/
|
|
||||||
/*! exports provided: default */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var vue_context__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue-context */ "./node_modules/vue-context/src/js/index.js");
|
|
||||||
/* harmony import */ var vue_context_src_sass_vue_context_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue-context/src/sass/vue-context.scss */ "./node_modules/vue-context/src/sass/vue-context.scss");
|
|
||||||
/* harmony import */ var vue_context_src_sass_vue_context_scss__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(vue_context_src_sass_vue_context_scss__WEBPACK_IMPORTED_MODULE_1__);
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
|
|
||||||
|
|
||||||
var items = ['Cras justo odio', 'Dapibus ac facilisis in', 'Morbi leo risus', 'Porta ac consectetur ac', 'Vestibulum at eros'];
|
|
||||||
/* harmony default export */ __webpack_exports__["default"] = ({
|
|
||||||
components: {
|
|
||||||
VueContext: vue_context__WEBPACK_IMPORTED_MODULE_0__["default"]
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
showReset: function showReset() {
|
|
||||||
return this.items.length < items.length;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data: function data() {
|
|
||||||
return {
|
|
||||||
items: [].concat(items)
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
alertName: function alertName(name) {
|
|
||||||
alert("You clicked on \"".concat(name, "\"!"));
|
|
||||||
},
|
|
||||||
remove: function remove(index) {
|
|
||||||
this.$delete(this.items, index);
|
|
||||||
},
|
|
||||||
reset: function reset() {
|
|
||||||
this.items = [].concat(items);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=script&lang=js&":
|
|
||||||
/*!************************************************************************************************************************************************!*\
|
|
||||||
!*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./js/advanced-2.vue?vue&type=script&lang=js& ***!
|
|
||||||
\************************************************************************************************************************************************/
|
|
||||||
/*! exports provided: default */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony import */ var vue_context__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue-context */ "./node_modules/vue-context/src/js/index.js");
|
|
||||||
/* harmony import */ var vue_context_src_sass_vue_context_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! vue-context/src/sass/vue-context.scss */ "./node_modules/vue-context/src/sass/vue-context.scss");
|
|
||||||
/* harmony import */ var vue_context_src_sass_vue_context_scss__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(vue_context_src_sass_vue_context_scss__WEBPACK_IMPORTED_MODULE_1__);
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//
|
|
||||||
|
|
||||||
|
|
||||||
/* harmony default export */ __webpack_exports__["default"] = ({
|
|
||||||
components: {
|
|
||||||
VueContext: vue_context__WEBPACK_IMPORTED_MODULE_0__["default"]
|
|
||||||
},
|
|
||||||
data: function data() {
|
|
||||||
return {
|
|
||||||
colors: [{
|
|
||||||
name: 'red',
|
|
||||||
hex: '#f44336'
|
|
||||||
}, {
|
|
||||||
name: 'blue',
|
|
||||||
hex: '#2196F3'
|
|
||||||
}, {
|
|
||||||
name: 'cyan',
|
|
||||||
hex: '#00BCD4'
|
|
||||||
}, {
|
|
||||||
name: 'green',
|
|
||||||
hex: '#4CAF50'
|
|
||||||
}, {
|
|
||||||
name: 'orange',
|
|
||||||
hex: '#FF9800'
|
|
||||||
}],
|
|
||||||
selectedColors: []
|
|
||||||
};
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
colorIndex: function colorIndex(hex) {
|
|
||||||
return this.selectedColors.findIndex(function (color) {
|
|
||||||
return color.hex === hex;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
hasColor: function hasColor(hex) {
|
|
||||||
return this.colorIndex(hex) > -1;
|
|
||||||
},
|
|
||||||
toggle: function toggle(color) {
|
|
||||||
var index = this.colorIndex(color.hex);
|
|
||||||
|
|
||||||
if (index > -1) {
|
|
||||||
this.$delete(this.selectedColors, index);
|
|
||||||
} else {
|
|
||||||
this.selectedColors.push(color);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/***/ }),
|
/***/ }),
|
||||||
|
|
||||||
/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./js/basic-usage.vue?vue&type=script&lang=js&":
|
/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./js/basic-usage.vue?vue&type=script&lang=js&":
|
||||||
@@ -1062,25 +715,6 @@ exports.push([module.i, "@charset \"UTF-8\";\n.v-context, .v-context ul {\n bac
|
|||||||
// exports
|
// exports
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./node_modules/css-loader/index.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true&":
|
|
||||||
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
|
||||||
!*** ./node_modules/css-loader!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--6-2!./node_modules/sass-loader/dist/cjs.js??ref--6-3!./node_modules/vue-loader/lib??vue-loader-options!./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true& ***!
|
|
||||||
\***********************************************************************************************************************************************************************************************************************************************************************************************************************/
|
|
||||||
/*! no static exports found */
|
|
||||||
/***/ (function(module, exports, __webpack_require__) {
|
|
||||||
|
|
||||||
exports = module.exports = __webpack_require__(/*! ../node_modules/css-loader/lib/css-base.js */ "./node_modules/css-loader/lib/css-base.js")(false);
|
|
||||||
// imports
|
|
||||||
|
|
||||||
|
|
||||||
// module
|
|
||||||
exports.push([module.i, ".color-box[data-v-d93846a2] {\n width: 100px;\n height: 100px;\n margin-right: 10px;\n border-radius: 4px;\n box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);\n opacity: 0.6;\n}\n.color-box.selected[data-v-d93846a2] {\n opacity: 1;\n}\n.color-box[data-v-d93846a2]:last-child {\n margin-right: 0;\n}", ""]);
|
|
||||||
|
|
||||||
// exports
|
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
/***/ }),
|
||||||
|
|
||||||
/***/ "./node_modules/css-loader/lib/css-base.js":
|
/***/ "./node_modules/css-loader/lib/css-base.js":
|
||||||
@@ -1563,36 +1197,6 @@ process.umask = function() { return 0; };
|
|||||||
|
|
||||||
/***/ }),
|
/***/ }),
|
||||||
|
|
||||||
/***/ "./node_modules/style-loader/index.js!./node_modules/css-loader/index.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true&":
|
|
||||||
/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
|
||||||
!*** ./node_modules/style-loader!./node_modules/css-loader!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--6-2!./node_modules/sass-loader/dist/cjs.js??ref--6-3!./node_modules/vue-loader/lib??vue-loader-options!./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true& ***!
|
|
||||||
\***************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
|
||||||
/*! no static exports found */
|
|
||||||
/***/ (function(module, exports, __webpack_require__) {
|
|
||||||
|
|
||||||
|
|
||||||
var content = __webpack_require__(/*! !../node_modules/css-loader!../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../node_modules/postcss-loader/src??ref--6-2!../node_modules/sass-loader/dist/cjs.js??ref--6-3!../node_modules/vue-loader/lib??vue-loader-options!./advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true& */ "./node_modules/css-loader/index.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=style&index=0&id=d93846a2&lang=scss&scoped=true&");
|
|
||||||
|
|
||||||
if(typeof content === 'string') content = [[module.i, content, '']];
|
|
||||||
|
|
||||||
var transform;
|
|
||||||
var insertInto;
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
var options = {"hmr":true}
|
|
||||||
|
|
||||||
options.transform = transform
|
|
||||||
options.insertInto = undefined;
|
|
||||||
|
|
||||||
var update = __webpack_require__(/*! ../node_modules/style-loader/lib/addStyles.js */ "./node_modules/style-loader/lib/addStyles.js")(content, options);
|
|
||||||
|
|
||||||
if(content.locals) module.exports = content.locals;
|
|
||||||
|
|
||||||
if(false) {}
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./node_modules/style-loader/lib/addStyles.js":
|
/***/ "./node_modules/style-loader/lib/addStyles.js":
|
||||||
/*!****************************************************!*\
|
/*!****************************************************!*\
|
||||||
!*** ./node_modules/style-loader/lib/addStyles.js ***!
|
!*** ./node_modules/style-loader/lib/addStyles.js ***!
|
||||||
@@ -2869,277 +2473,6 @@ if(content.locals) module.exports = content.locals;
|
|||||||
|
|
||||||
if(false) {}
|
if(false) {}
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-1.vue?vue&type=template&id=d95475a4&":
|
|
||||||
/*!****************************************************************************************************************************************************************************************!*\
|
|
||||||
!*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./js/advanced-1.vue?vue&type=template&id=d95475a4& ***!
|
|
||||||
\****************************************************************************************************************************************************************************************/
|
|
||||||
/*! exports provided: render, staticRenderFns */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; });
|
|
||||||
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; });
|
|
||||||
var render = function() {
|
|
||||||
var _vm = this
|
|
||||||
var _h = _vm.$createElement
|
|
||||||
var _c = _vm._self._c || _h
|
|
||||||
return _c(
|
|
||||||
"div",
|
|
||||||
[
|
|
||||||
_c(
|
|
||||||
"div",
|
|
||||||
{ staticClass: "bg-white shadow overflow-hidden sm:rounded-md" },
|
|
||||||
[
|
|
||||||
_c("ul", { staticClass: "demo" }, [
|
|
||||||
_c(
|
|
||||||
"li",
|
|
||||||
_vm._l(_vm.items, function(item, index) {
|
|
||||||
return _c(
|
|
||||||
"a",
|
|
||||||
{
|
|
||||||
key: index,
|
|
||||||
staticClass:
|
|
||||||
"block hover:bg-gray-50 focus:outline-none focus:bg-gray-50 transition duration-150 ease-in-out",
|
|
||||||
class: { "border-t border-gray-200": index > 0 },
|
|
||||||
attrs: { href: "#" },
|
|
||||||
on: {
|
|
||||||
contextmenu: function($event) {
|
|
||||||
$event.preventDefault()
|
|
||||||
return _vm.$refs.menu.open($event, {
|
|
||||||
name: item,
|
|
||||||
index: index
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[
|
|
||||||
_c(
|
|
||||||
"div",
|
|
||||||
{ staticClass: "flex items-center px-4 py-4 sm:px-6" },
|
|
||||||
[
|
|
||||||
_c(
|
|
||||||
"div",
|
|
||||||
{
|
|
||||||
staticClass:
|
|
||||||
"min-w-0 flex-1 md:grid md:grid-cols-2 md:gap-4"
|
|
||||||
},
|
|
||||||
[
|
|
||||||
_c("div", {
|
|
||||||
staticClass:
|
|
||||||
"text-sm leading-5 font-medium text-gray-600 truncate",
|
|
||||||
domProps: { textContent: _vm._s(item) }
|
|
||||||
})
|
|
||||||
]
|
|
||||||
)
|
|
||||||
]
|
|
||||||
)
|
|
||||||
]
|
|
||||||
)
|
|
||||||
}),
|
|
||||||
0
|
|
||||||
)
|
|
||||||
])
|
|
||||||
]
|
|
||||||
),
|
|
||||||
_vm._v(" "),
|
|
||||||
_c(
|
|
||||||
"div",
|
|
||||||
{
|
|
||||||
directives: [
|
|
||||||
{
|
|
||||||
name: "show",
|
|
||||||
rawName: "v-show",
|
|
||||||
value: _vm.showReset,
|
|
||||||
expression: "showReset"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
staticClass: "my-4 text-right"
|
|
||||||
},
|
|
||||||
[
|
|
||||||
_c(
|
|
||||||
"button",
|
|
||||||
{
|
|
||||||
staticClass:
|
|
||||||
"inline-flex items-center px-4 py-2 border border-transparent text-sm leading-5 font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-50 focus:outline-none focus:border-indigo-300 focus:shadow-outline-indigo active:bg-indigo-200 transition ease-in-out duration-150",
|
|
||||||
attrs: { type: "button" },
|
|
||||||
on: { click: _vm.reset }
|
|
||||||
},
|
|
||||||
[_vm._v("\n Reset Demo\n ")]
|
|
||||||
)
|
|
||||||
]
|
|
||||||
),
|
|
||||||
_vm._v(" "),
|
|
||||||
_c("vue-context", {
|
|
||||||
ref: "menu",
|
|
||||||
scopedSlots: _vm._u([
|
|
||||||
{
|
|
||||||
key: "default",
|
|
||||||
fn: function(ref) {
|
|
||||||
var data = ref.data
|
|
||||||
return [
|
|
||||||
data
|
|
||||||
? [
|
|
||||||
_c("li", [
|
|
||||||
_c(
|
|
||||||
"a",
|
|
||||||
{
|
|
||||||
on: {
|
|
||||||
click: function($event) {
|
|
||||||
$event.preventDefault()
|
|
||||||
return _vm.alertName(data.name)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[
|
|
||||||
_vm._v(
|
|
||||||
"\n Alert name\n "
|
|
||||||
)
|
|
||||||
]
|
|
||||||
)
|
|
||||||
]),
|
|
||||||
_vm._v(" "),
|
|
||||||
_c("li", [
|
|
||||||
_c(
|
|
||||||
"a",
|
|
||||||
{
|
|
||||||
on: {
|
|
||||||
click: function($event) {
|
|
||||||
$event.preventDefault()
|
|
||||||
return _vm.remove(data.index)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[
|
|
||||||
_vm._v(
|
|
||||||
'\n Delete "' +
|
|
||||||
_vm._s(data.name) +
|
|
||||||
'"\n '
|
|
||||||
)
|
|
||||||
]
|
|
||||||
)
|
|
||||||
])
|
|
||||||
]
|
|
||||||
: _vm._e()
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
])
|
|
||||||
})
|
|
||||||
],
|
|
||||||
1
|
|
||||||
)
|
|
||||||
}
|
|
||||||
var staticRenderFns = []
|
|
||||||
render._withStripped = true
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
|
||||||
|
|
||||||
/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./js/advanced-2.vue?vue&type=template&id=d93846a2&scoped=true&":
|
|
||||||
/*!****************************************************************************************************************************************************************************************************!*\
|
|
||||||
!*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./js/advanced-2.vue?vue&type=template&id=d93846a2&scoped=true& ***!
|
|
||||||
\****************************************************************************************************************************************************************************************************/
|
|
||||||
/*! exports provided: render, staticRenderFns */
|
|
||||||
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
||||||
|
|
||||||
"use strict";
|
|
||||||
__webpack_require__.r(__webpack_exports__);
|
|
||||||
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; });
|
|
||||||
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; });
|
|
||||||
var render = function() {
|
|
||||||
var _vm = this
|
|
||||||
var _h = _vm.$createElement
|
|
||||||
var _c = _vm._self._c || _h
|
|
||||||
return _c(
|
|
||||||
"div",
|
|
||||||
{ staticClass: "mt-5" },
|
|
||||||
[
|
|
||||||
_c(
|
|
||||||
"div",
|
|
||||||
{ staticClass: "flex flex-wrap" },
|
|
||||||
_vm._l(_vm.colors, function(color, index) {
|
|
||||||
return _c(
|
|
||||||
"div",
|
|
||||||
{
|
|
||||||
key: index,
|
|
||||||
staticClass: "color-box",
|
|
||||||
class: { selected: _vm.hasColor(color.hex) },
|
|
||||||
style: { "background-color": color.hex },
|
|
||||||
on: {
|
|
||||||
contextmenu: function($event) {
|
|
||||||
$event.preventDefault()
|
|
||||||
return _vm.$refs.menu.open($event, color)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[_vm._v("\n \n ")]
|
|
||||||
)
|
|
||||||
}),
|
|
||||||
0
|
|
||||||
),
|
|
||||||
_vm._v(" "),
|
|
||||||
_c("h5", { staticClass: "my-4" }, [
|
|
||||||
_vm._v("\n Selected colors:\n ")
|
|
||||||
]),
|
|
||||||
_vm._v(" "),
|
|
||||||
_c("code", { staticClass: "mb-3" }, [_vm._v(_vm._s(_vm.selectedColors))]),
|
|
||||||
_vm._v(" "),
|
|
||||||
_c("vue-context", {
|
|
||||||
ref: "menu",
|
|
||||||
scopedSlots: _vm._u(
|
|
||||||
[
|
|
||||||
{
|
|
||||||
key: "default",
|
|
||||||
fn: function(child) {
|
|
||||||
return child.data
|
|
||||||
? [
|
|
||||||
_c("li", [
|
|
||||||
_c(
|
|
||||||
"a",
|
|
||||||
{
|
|
||||||
attrs: { href: "#" },
|
|
||||||
on: {
|
|
||||||
click: function($event) {
|
|
||||||
$event.preventDefault()
|
|
||||||
return _vm.toggle(child.data)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[
|
|
||||||
_vm._v(
|
|
||||||
"\n " +
|
|
||||||
_vm._s(
|
|
||||||
_vm.hasColor(child.data.hex)
|
|
||||||
? "Remove Color"
|
|
||||||
: "Select Color"
|
|
||||||
) +
|
|
||||||
"\n "
|
|
||||||
)
|
|
||||||
]
|
|
||||||
)
|
|
||||||
])
|
|
||||||
]
|
|
||||||
: undefined
|
|
||||||
}
|
|
||||||
}
|
|
||||||
],
|
|
||||||
null,
|
|
||||||
true
|
|
||||||
)
|
|
||||||
})
|
|
||||||
],
|
|
||||||
1
|
|
||||||
)
|
|
||||||
}
|
|
||||||
var staticRenderFns = []
|
|
||||||
render._withStripped = true
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/***/ }),
|
/***/ }),
|
||||||
|
|
||||||
/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./js/basic-usage.vue?vue&type=template&id=eebfc2ec&":
|
/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./js/basic-usage.vue?vue&type=template&id=eebfc2ec&":
|
||||||
|
|||||||
Reference in New Issue
Block a user