|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120 |
- var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
- import '../../../src/stylus/components/_expansion-panel.styl';
- import Themeable from '../../mixins/themeable';
- import { provide as RegistrableProvide } from '../../mixins/registrable';
- import mixins from '../../util/mixins';
- /* @vue/component */
- export default mixins(Themeable, RegistrableProvide('expansionPanel')).extend({
- name: 'v-expansion-panel',
- provide: function provide() {
- return {
- expansionPanel: this
- };
- },
-
- props: {
- disabled: Boolean,
- readonly: Boolean,
- expand: Boolean,
- focusable: Boolean,
- inset: Boolean,
- popout: Boolean,
- value: {
- type: [Number, Array],
- default: function _default() {
- return null;
- }
- }
- },
- data: function data() {
- return {
- items: [],
- open: []
- };
- },
- computed: {
- classes: function classes() {
- return _extends({
- 'v-expansion-panel--focusable': this.focusable,
- 'v-expansion-panel--popout': this.popout,
- 'v-expansion-panel--inset': this.inset
- }, this.themeClasses);
- }
- },
- watch: {
- expand: function expand(v) {
- var openIndex = -1;
- if (!v) {
- // Close all panels unless only one is open
- var openCount = this.open.reduce(function (acc, val) {
- return val ? acc + 1 : acc;
- }, 0);
- var open = Array(this.items.length).fill(false);
- if (openCount === 1) {
- openIndex = this.open.indexOf(true);
- }
- if (openIndex > -1) {
- open[openIndex] = true;
- }
- this.open = open;
- }
- this.$emit('input', v ? this.open : openIndex > -1 ? openIndex : null);
- },
- value: function value(v) {
- this.updateFromValue(v);
- }
- },
- mounted: function mounted() {
- this.value !== null && this.updateFromValue(this.value);
- },
-
- methods: {
- updateFromValue: function updateFromValue(v) {
- if (Array.isArray(v) && !this.expand) return;
- var open = Array(this.items.length).fill(false);
- if (typeof v === 'number') {
- open[v] = true;
- } else if (v !== null) {
- open = v;
- }
- this.updatePanels(open);
- },
- updatePanels: function updatePanels(open) {
- this.open = open;
- for (var i = 0; i < this.items.length; i++) {
- this.items[i].toggle(open && open[i]);
- }
- },
- panelClick: function panelClick(uid) {
- var open = this.expand ? this.open.slice() : Array(this.items.length).fill(false);
- for (var i = 0; i < this.items.length; i++) {
- if (this.items[i]._uid === uid) {
- open[i] = !this.open[i];
- !this.expand && this.$emit('input', open[i] ? i : null);
- }
- }
- this.updatePanels(open);
- if (this.expand) this.$emit('input', open);
- },
- register: function register(content) {
- var i = this.items.push(content) - 1;
- this.value !== null && this.updateFromValue(this.value);
- content.toggle(!!this.open[i]);
- },
- unregister: function unregister(content) {
- var index = this.items.findIndex(function (i) {
- return i._uid === content._uid;
- });
- this.items.splice(index, 1);
- this.open.splice(index, 1);
- }
- },
- render: function render(h) {
- return h('ul', {
- staticClass: 'v-expansion-panel',
- class: this.classes
- }, this.$slots.default);
- }
- });
- //# sourceMappingURL=VExpansionPanel.js.map
|