mirrors/vue-select
2
0
Fork 0
mirror of https://github.com/tenrok/vue-select.git synced 2026-06-13 08:32:26 +03:00
Code Activity

update mixins to ES6 module exports

Browse Source
This commit is contained in:
Jeff
2018-08-12 19:38:51 -07:00
parent 48782a7664
commit 945e908e3f
3 changed files with 112 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/mixins/ajax.js
+68 -68
View File
@@ -1,72 +1,72 @@
module.exports = {
props: {
/**
* Toggles the adding of a 'loading' class to the main
* .v-select wrapper. Useful to control UI state when
* results are being processed through AJAX.
*/
loading: {
type: Boolean,
default: false
},
/**
* Accept a callback function that will be
* run when the search text changes.
*
* loading() accepts a boolean value, and can
* be used to toggle a loading class from
* the onSearch callback.
*
* @param {search} String Current search text
* @param {loading} Function(bool) Toggle loading class
*/
onSearch: {
type: Function,
default: function(search, loading){}
}
},
data() {
return {
mutableLoading: false
}
},
watch: {
/**
* If a callback & search text has been provided,
* invoke the onSearch callback.
*/
search() {
if (this.search.length > 0) {
this.onSearch(this.search, this.toggleLoading)
this.$emit('search', this.search, this.toggleLoading)
}
},
export default {
props: {
/**
* Sync the loading prop with the internal
* mutable loading value.
* Toggles the adding of a 'loading' class to the main
* .v-select wrapper. Useful to control UI state when
* results are being processed through AJAX.
*/
loading: {
type: Boolean,
default: false
},
/**
* Accept a callback function that will be
* run when the search text changes.
*
* loading() accepts a boolean value, and can
* be used to toggle a loading class from
* the onSearch callback.
*
* @param {search} String Current search text
* @param {loading} Function(bool) Toggle loading class
*/
onSearch: {
type: Function,
default: function(search, loading) {} // eslint-disable-line no-unused-vars
}
},
data() {
return {
mutableLoading: false
};
},
watch: {
/**
* If a callback & search text has been provided,
* invoke the onSearch callback.
*/
search() {
if (this.search.length > 0) {
this.onSearch(this.search, this.toggleLoading);
this.$emit("search", this.search, this.toggleLoading);
}
},
/**
* Sync the loading prop with the internal
* mutable loading value.
* @param val
*/
loading(val) {
this.mutableLoading = val
}
},
loading(val) {
this.mutableLoading = val;
}
},
methods: {
/**
* Toggle this.loading. Optionally pass a boolean
* value. If no value is provided, this.loading
* will be set to the opposite of it's current value.
* @param toggle Boolean
* @returns {*}
*/
toggleLoading(toggle = null) {
if (toggle == null) {
return this.mutableLoading = !this.mutableLoading
}
return this.mutableLoading = toggle
}
}
}
methods: {
/**
* Toggle this.loading. Optionally pass a boolean
* value. If no value is provided, this.loading
* will be set to the opposite of it's current value.
* @param toggle Boolean
* @returns {*}
*/
toggleLoading(toggle = null) {
if (toggle == null) {
return (this.mutableLoading = !this.mutableLoading);
}
return (this.mutableLoading = toggle);
}
}
};
src/mixins/pointerScroll.js
+28 -22
View File
@@ -1,9 +1,7 @@
// flow
module.exports = {
export default {
watch: {
typeAheadPointer() {
this.maybeAdjustScroll()
this.maybeAdjustScroll();
}
},
@@ -15,13 +13,13 @@ module.exports = {
* @returns {*}
*/
maybeAdjustScroll() {
let pixelsToPointerTop = this.pixelsToPointerTop()
let pixelsToPointerBottom = this.pixelsToPointerBottom()
let pixelsToPointerTop = this.pixelsToPointerTop();
let pixelsToPointerBottom = this.pixelsToPointerBottom();
if ( pixelsToPointerTop <= this.viewport().top) {
return this.scrollTo( pixelsToPointerTop )
if (pixelsToPointerTop <= this.viewport().top) {
return this.scrollTo(pixelsToPointerTop);
} else if (pixelsToPointerBottom >= this.viewport().bottom) {
return this.scrollTo( this.viewport().top + this.pointerHeight() )
return this.scrollTo(this.viewport().top + this.pointerHeight());
}
},
@@ -31,13 +29,14 @@ module.exports = {
* @returns {number}
*/
pixelsToPointerTop() {
let pixelsToPointerTop = 0
if( this.$refs.dropdownMenu ) {
let pixelsToPointerTop = 0;
if (this.$refs.dropdownMenu) {
for (let i = 0; i < this.typeAheadPointer; i++) {
pixelsToPointerTop += this.$refs.dropdownMenu.children[i].offsetHeight
pixelsToPointerTop += this.$refs.dropdownMenu.children[i]
.offsetHeight;
}
}
return pixelsToPointerTop
return pixelsToPointerTop;
},
/**
@@ -46,7 +45,7 @@ module.exports = {
* @returns {*}
*/
pixelsToPointerBottom() {
return this.pixelsToPointerTop() + this.pointerHeight()
return this.pixelsToPointerTop() + this.pointerHeight();
},
/**
@@ -54,8 +53,10 @@ module.exports = {
* @returns {number}
*/
pointerHeight() {
let element = this.$refs.dropdownMenu ? this.$refs.dropdownMenu.children[this.typeAheadPointer] : false
return element ? element.offsetHeight : 0
let element = this.$refs.dropdownMenu
? this.$refs.dropdownMenu.children[this.typeAheadPointer]
: false;
return element ? element.offsetHeight : 0;
},
/**
@@ -64,9 +65,12 @@ module.exports = {
*/
viewport() {
return {
top: this.$refs.dropdownMenu ? this.$refs.dropdownMenu.scrollTop: 0,
bottom: this.$refs.dropdownMenu ? this.$refs.dropdownMenu.offsetHeight + this.$refs.dropdownMenu.scrollTop : 0
}
top: this.$refs.dropdownMenu ? this.$refs.dropdownMenu.scrollTop : 0,
bottom: this.$refs.dropdownMenu
? this.$refs.dropdownMenu.offsetHeight +
this.$refs.dropdownMenu.scrollTop
: 0
};
},
/**
@@ -75,7 +79,9 @@ module.exports = {
* @returns {*}
*/
scrollTo(position) {
return this.$refs.dropdownMenu ? this.$refs.dropdownMenu.scrollTop = position : null
},
return this.$refs.dropdownMenu
? (this.$refs.dropdownMenu.scrollTop = position)
: null;
}
}
}
};
src/mixins/typeAheadPointer.js
+16 -16
View File
@@ -1,13 +1,13 @@
module.exports = {
export default {
data() {
return {
typeAheadPointer: -1
}
};
},
watch: {
filteredOptions() {
this.typeAheadPointer = 0
this.typeAheadPointer = 0;
}
},
@@ -19,9 +19,9 @@ module.exports = {
*/
typeAheadUp() {
if (this.typeAheadPointer > 0) {
this.typeAheadPointer--
if( this.maybeAdjustScroll ) {
this.maybeAdjustScroll()
this.typeAheadPointer--;
if (this.maybeAdjustScroll) {
this.maybeAdjustScroll();
}
}
},
@@ -33,9 +33,9 @@ module.exports = {
*/
typeAheadDown() {
if (this.typeAheadPointer < this.filteredOptions.length - 1) {
this.typeAheadPointer++
if( this.maybeAdjustScroll ) {
this.maybeAdjustScroll()
this.typeAheadPointer++;
if (this.maybeAdjustScroll) {
this.maybeAdjustScroll();
}
}
},
@@ -46,15 +46,15 @@ module.exports = {
* @return {void}
*/
typeAheadSelect() {
if( this.filteredOptions[ this.typeAheadPointer ] ) {
this.select( this.filteredOptions[ this.typeAheadPointer ] );
} else if (this.taggable && this.search.length){
this.select(this.search)
if (this.filteredOptions[this.typeAheadPointer]) {
this.select(this.filteredOptions[this.typeAheadPointer]);
} else if (this.taggable && this.search.length) {
this.select(this.search);
}
if( this.clearSearchOnSelect ) {
if (this.clearSearchOnSelect) {
this.search = "";
}
},
}
}
}
};