86 lines
1.9 KiB
JavaScript
86 lines
1.9 KiB
JavaScript
|
// Mixins
|
||
|
import { factory as GroupableFactory } from '../../mixins/groupable';
|
||
|
import { provide as RegistrableProvide } from '../../mixins/registrable'; // Utilities
|
||
|
|
||
|
import { getSlot } from '../../util/helpers';
|
||
|
import mixins from '../../util/mixins';
|
||
|
export default mixins(GroupableFactory('expansionPanels', 'v-expansion-panel', 'v-expansion-panels'), RegistrableProvide('expansionPanel', true)
|
||
|
/* @vue/component */
|
||
|
).extend({
|
||
|
name: 'v-expansion-panel',
|
||
|
props: {
|
||
|
disabled: Boolean,
|
||
|
readonly: Boolean
|
||
|
},
|
||
|
|
||
|
data() {
|
||
|
return {
|
||
|
content: null,
|
||
|
header: null,
|
||
|
nextIsActive: false
|
||
|
};
|
||
|
},
|
||
|
|
||
|
computed: {
|
||
|
classes() {
|
||
|
return {
|
||
|
'v-expansion-panel--active': this.isActive,
|
||
|
'v-expansion-panel--next-active': this.nextIsActive,
|
||
|
'v-expansion-panel--disabled': this.isDisabled,
|
||
|
...this.groupClasses
|
||
|
};
|
||
|
},
|
||
|
|
||
|
isDisabled() {
|
||
|
return this.expansionPanels.disabled || this.disabled;
|
||
|
},
|
||
|
|
||
|
isReadonly() {
|
||
|
return this.expansionPanels.readonly || this.readonly;
|
||
|
}
|
||
|
|
||
|
},
|
||
|
methods: {
|
||
|
registerContent(vm) {
|
||
|
this.content = vm;
|
||
|
},
|
||
|
|
||
|
unregisterContent() {
|
||
|
this.content = null;
|
||
|
},
|
||
|
|
||
|
registerHeader(vm) {
|
||
|
this.header = vm;
|
||
|
vm.$on('click', this.onClick);
|
||
|
},
|
||
|
|
||
|
unregisterHeader() {
|
||
|
this.header = null;
|
||
|
},
|
||
|
|
||
|
onClick(e) {
|
||
|
if (e.detail) this.header.$el.blur();
|
||
|
this.$emit('click', e);
|
||
|
this.isReadonly || this.isDisabled || this.toggle();
|
||
|
},
|
||
|
|
||
|
toggle() {
|
||
|
/* istanbul ignore else */
|
||
|
if (this.content) this.content.isBooted = true;
|
||
|
this.$nextTick(() => this.$emit('change'));
|
||
|
}
|
||
|
|
||
|
},
|
||
|
|
||
|
render(h) {
|
||
|
return h('div', {
|
||
|
staticClass: 'v-expansion-panel',
|
||
|
class: this.classes,
|
||
|
attrs: {
|
||
|
'aria-expanded': String(this.isActive)
|
||
|
}
|
||
|
}, getSlot(this));
|
||
|
}
|
||
|
|
||
|
});
|
||
|
//# sourceMappingURL=VExpansionPanel.js.map
|