This repository has been archived on 2024-07-27. You can view files and clone it, but cannot push or open issues or pull requests.
keksAccountGUI/node_modulesOLD/vuetify/lib/components/VBanner/VBanner.js

152 lines
3.4 KiB
JavaScript
Raw Normal View History

2019-08-11 18:48:02 +00:00
// Styles
import "../../../src/components/VBanner/VBanner.sass"; // Extensions
import VSheet from '../VSheet'; // Components
import VAvatar from '../VAvatar';
import VIcon from '../VIcon';
import { VExpandTransition } from '../transitions'; // Mixins
import Toggleable from '../../mixins/toggleable';
import mixins from '../../util/mixins';
/* @vue/component */
export default mixins(VSheet, Toggleable).extend({
name: 'v-banner',
inheritAttrs: false,
props: {
icon: String,
iconColor: String,
mobileBreakPoint: {
type: [Number, String],
default: 960
},
singleLine: Boolean,
sticky: Boolean,
tile: {
type: Boolean,
default: true
},
value: {
type: Boolean,
default: true
}
},
computed: {
classes() {
return { ...VSheet.options.computed.classes.call(this),
'v-banner--has-icon': this.hasIcon,
'v-banner--is-mobile': this.isMobile,
'v-banner--single-line': this.singleLine,
'v-banner--sticky': this.sticky
};
},
hasActions() {
return Boolean(this.$slots.actions || this.$scopedSlots.actions);
},
hasIcon() {
return Boolean(this.icon || this.$slots.icon);
},
isMobile() {
return this.$vuetify.breakpoint.width < Number(this.mobileBreakPoint);
},
styles() {
const styles = VSheet.options.computed.styles.call(this);
if (!this.sticky) return styles;
const {
bar,
top
} = this.$vuetify.application;
return { ...styles,
position: 'sticky',
top: `${bar + top}px`,
zIndex: 1
};
}
},
methods: {
/** @public */
toggle() {
this.isActive = !this.isActive;
},
iconClick(e) {
this.$emit('click:icon', e);
},
genIcon() {
if (!this.hasIcon) return undefined;
let content;
if (this.icon) {
content = this.$createElement(VIcon, {
props: {
color: this.iconColor,
size: 28
}
}, [this.icon]);
} else {
content = this.$slots.icon;
}
return this.$createElement(VAvatar, {
staticClass: 'v-banner__icon',
props: {
color: this.color,
size: 40
},
on: {
click: this.iconClick
}
}, [content]);
},
genText() {
return this.$createElement('div', {
staticClass: 'v-banner__text'
}, this.$slots.default);
},
genActions() {
if (!this.hasActions) return undefined;
const children = this.$scopedSlots.actions ? this.$scopedSlots.actions({
dismiss: () => this.isActive = false
}) : this.$slots.actions;
return this.$createElement('div', {
staticClass: 'v-banner__actions'
}, children);
},
genContent() {
return this.$createElement('div', {
staticClass: 'v-banner__content'
}, [this.genIcon(), this.genText()]);
},
genWrapper() {
return this.$createElement('div', {
staticClass: 'v-banner__wrapper'
}, [this.genContent(), this.genActions()]);
}
},
render(h) {
return h(VExpandTransition, [h('div', {
staticClass: 'v-banner',
class: this.classes,
style: this.styles,
directives: [{
name: 'show',
value: this.isActive
}]
}, [this.genWrapper()])]);
}
});
//# sourceMappingURL=VBanner.js.map