"use strict";
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
exports.__esModule = true;
|
exports.default = void 0;
|
|
var _utils = require("../utils");
|
|
var _popup = require("../mixins/popup");
|
|
var _icon = _interopRequireDefault(require("../icon"));
|
|
var _createNamespace = (0, _utils.createNamespace)('popup'),
|
createComponent = _createNamespace[0],
|
bem = _createNamespace[1];
|
|
var _default = createComponent({
|
mixins: [(0, _popup.PopupMixin)()],
|
props: {
|
round: Boolean,
|
duration: [Number, String],
|
closeable: Boolean,
|
transition: String,
|
safeAreaInsetBottom: Boolean,
|
closeIcon: {
|
type: String,
|
default: 'cross'
|
},
|
closeIconPosition: {
|
type: String,
|
default: 'top-right'
|
},
|
position: {
|
type: String,
|
default: 'center'
|
},
|
overlay: {
|
type: Boolean,
|
default: true
|
},
|
closeOnClickOverlay: {
|
type: Boolean,
|
default: true
|
}
|
},
|
beforeCreate: function beforeCreate() {
|
var _this = this;
|
|
var createEmitter = function createEmitter(eventName) {
|
return function (event) {
|
return _this.$emit(eventName, event);
|
};
|
};
|
|
this.onClick = createEmitter('click');
|
this.onOpened = createEmitter('opened');
|
this.onClosed = createEmitter('closed');
|
},
|
methods: {
|
onClickCloseIcon: function onClickCloseIcon(event) {
|
this.$emit('click-close-icon', event);
|
this.close();
|
}
|
},
|
render: function render() {
|
var _bem;
|
|
var h = arguments[0];
|
|
if (!this.shouldRender) {
|
return;
|
}
|
|
var round = this.round,
|
position = this.position,
|
duration = this.duration;
|
var isCenter = position === 'center';
|
var transitionName = this.transition || (isCenter ? 'van-fade' : "van-popup-slide-" + position);
|
var style = {};
|
|
if ((0, _utils.isDef)(duration)) {
|
var key = isCenter ? 'animationDuration' : 'transitionDuration';
|
style[key] = duration + "s";
|
}
|
|
return h("transition", {
|
"attrs": {
|
"appear": this.transitionAppear,
|
"name": transitionName
|
},
|
"on": {
|
"afterEnter": this.onOpened,
|
"afterLeave": this.onClosed
|
}
|
}, [h("div", {
|
"directives": [{
|
name: "show",
|
value: this.value
|
}],
|
"style": style,
|
"class": bem((_bem = {
|
round: round
|
}, _bem[position] = position, _bem['safe-area-inset-bottom'] = this.safeAreaInsetBottom, _bem)),
|
"on": {
|
"click": this.onClick
|
}
|
}, [this.slots(), this.closeable && h(_icon.default, {
|
"attrs": {
|
"role": "button",
|
"tabindex": "0",
|
"name": this.closeIcon
|
},
|
"class": bem('close-icon', this.closeIconPosition),
|
"on": {
|
"click": this.onClickCloseIcon
|
}
|
})])]);
|
}
|
});
|
|
exports.default = _default;
|
