buefy
Version:
Lightweight UI components for Vue.js based on Bulma
95 lines (84 loc) • 3.58 kB
JavaScript
var __chunk_1 = require('./chunk-9f6a8079.js');
var __chunk_4 = require('./chunk-50b06939.js');
var __chunk_5 = require('./chunk-d492406b.js');
var __chunk_6 = require('./chunk-13e039f5.js');
var script = {
name: 'BSelect',
components: __chunk_1._defineProperty({}, __chunk_5.Icon.name, __chunk_5.Icon),
mixins: [__chunk_4.FormElementMixin],
inheritAttrs: false,
props: {
value: {
type: [String, Number, Boolean, Object, Array, Symbol, Function],
default: null
},
placeholder: String,
multiple: Boolean,
nativeSize: [String, Number]
},
data: function data() {
return {
selected: this.value,
_elementRef: 'select'
};
},
computed: {
computedValue: {
get: function get() {
return this.selected;
},
set: function set(value) {
this.selected = value;
this.$emit('input', value);
!this.isValid && this.checkHtml5Validity();
}
},
spanClasses: function spanClasses() {
return [this.size, this.statusType, {
'is-fullwidth': this.expanded,
'is-loading': this.loading,
'is-multiple': this.multiple,
'is-rounded': this.rounded,
'is-empty': this.selected === null
}];
}
},
watch: {
/**
* When v-model is changed:
* 1. Set the selected option.
* 2. If it's invalid, validate again.
*/
value: function value(_value) {
this.selected = _value;
!this.isValid && this.checkHtml5Validity();
}
}
};
/* script */
const __vue_script__ = script;
/* template */
var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"control",class:{ 'is-expanded': _vm.expanded, 'has-icons-left': _vm.icon }},[_c('span',{staticClass:"select",class:_vm.spanClasses},[_c('select',_vm._g(_vm._b({directives:[{name:"model",rawName:"v-model",value:(_vm.computedValue),expression:"computedValue"}],ref:"select",attrs:{"multiple":_vm.multiple,"size":_vm.nativeSize},on:{"blur":function($event){_vm.$emit('blur', $event) && _vm.checkHtml5Validity();},"focus":function($event){_vm.$emit('focus', $event);},"change":function($event){var $$selectedVal = Array.prototype.filter.call($event.target.options,function(o){return o.selected}).map(function(o){var val = "_value" in o ? o._value : o.value;return val}); _vm.computedValue=$event.target.multiple ? $$selectedVal : $$selectedVal[0];}}},'select',_vm.$attrs,false),_vm.$listeners),[(_vm.placeholder)?[(_vm.computedValue == null)?_c('option',{attrs:{"disabled":"","hidden":""},domProps:{"value":null}},[_vm._v("\n "+_vm._s(_vm.placeholder)+"\n ")]):_vm._e()]:_vm._e(),_vm._v(" "),_vm._t("default")],2)]),_vm._v(" "),(_vm.icon)?_c('b-icon',{staticClass:"is-left",attrs:{"icon":_vm.icon,"pack":_vm.iconPack,"size":_vm.iconSize}}):_vm._e()],1)};
var __vue_staticRenderFns__ = [];
/* style */
const __vue_inject_styles__ = undefined;
/* scoped */
const __vue_scope_id__ = undefined;
/* module identifier */
const __vue_module_identifier__ = undefined;
/* functional template */
const __vue_is_functional_template__ = false;
/* style inject */
/* style inject SSR */
var Select = __chunk_6.__vue_normalize__(
{ render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
__vue_inject_styles__,
__vue_script__,
__vue_scope_id__,
__vue_is_functional_template__,
__vue_module_identifier__,
undefined,
undefined
);
exports.Select = Select;
;