123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123 |
- function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
- import { VExpandTransition } from '../transitions';
- import Bootable from '../../mixins/bootable';
- import Toggleable from '../../mixins/toggleable';
- import Rippleable from '../../mixins/rippleable';
- import { inject as RegistrableInject } from '../../mixins/registrable';
- import VIcon from '../VIcon';
- import mixins from '../../util/mixins';
- import { consoleWarn } from '../../util/console';
- export default mixins(Bootable, Toggleable, Rippleable, RegistrableInject('expansionPanel', 'v-expansion-panel-content', 'v-expansion-panel')
- /* @vue/component */
- ).extend({
- name: 'v-expansion-panel-content',
- props: {
- disabled: Boolean,
- readonly: Boolean,
- expandIcon: {
- type: String,
- default: '$vuetify.icons.expand'
- },
- hideActions: Boolean,
- ripple: {
- type: [Boolean, Object],
- default: false
- }
- },
- data: function data() {
- return {
- height: 'auto'
- };
- },
- computed: {
- containerClasses: function containerClasses() {
- return {
- 'v-expansion-panel__container--active': this.isActive,
- 'v-expansion-panel__container--disabled': this.isDisabled
- };
- },
- isDisabled: function isDisabled() {
- return this.expansionPanel.disabled || this.disabled;
- },
- isReadonly: function isReadonly() {
- return this.expansionPanel.readonly || this.readonly;
- }
- },
- beforeMount: function beforeMount() {
- this.expansionPanel.register(this);
- // Can be removed once fully deprecated
- if (typeof this.value !== 'undefined') consoleWarn('v-model has been deprecated', this);
- },
- beforeDestroy: function beforeDestroy() {
- this.expansionPanel.unregister(this);
- },
-
- methods: {
- onKeydown: function onKeydown(e) {
- // Ensure element is the activeElement
- if (e.keyCode === 13 && this.$el === document.activeElement) this.expansionPanel.panelClick(this._uid);
- },
- onHeaderClick: function onHeaderClick() {
- this.isReadonly || this.expansionPanel.panelClick(this._uid);
- },
- genBody: function genBody() {
- return this.$createElement('div', {
- ref: 'body',
- class: 'v-expansion-panel__body',
- directives: [{
- name: 'show',
- value: this.isActive
- }]
- }, this.showLazyContent(this.$slots.default));
- },
- genHeader: function genHeader() {
- var children = [].concat(_toConsumableArray(this.$slots.header || []));
- if (!this.hideActions) children.push(this.genIcon());
- return this.$createElement('div', {
- staticClass: 'v-expansion-panel__header',
- directives: [{
- name: 'ripple',
- value: this.ripple
- }],
- on: {
- click: this.onHeaderClick
- }
- }, children);
- },
- genIcon: function genIcon() {
- var icon = this.$slots.actions || [this.$createElement(VIcon, this.expandIcon)];
- return this.$createElement('transition', {
- attrs: { name: 'fade-transition' }
- }, [this.$createElement('div', {
- staticClass: 'v-expansion-panel__header__icon',
- directives: [{
- name: 'show',
- value: !this.isDisabled
- }]
- }, icon)]);
- },
- toggle: function toggle(active) {
- var _this = this;
-
- if (active) this.isBooted = true;
- this.$nextTick(function () {
- return _this.isActive = active;
- });
- }
- },
- render: function render(h) {
- return h('li', {
- staticClass: 'v-expansion-panel__container',
- class: this.containerClasses,
- attrs: {
- tabindex: this.isReadonly || this.isDisabled ? null : 0,
- 'aria-expanded': Boolean(this.isActive)
- },
- on: {
- keydown: this.onKeydown
- }
- }, [this.$slots.header && this.genHeader(), h(VExpandTransition, [this.genBody()])]);
- }
- });
- //# sourceMappingURL=VExpansionPanelContent.js.map
|