@ohu-mobile/core
Version:
174 lines (173 loc) • 7.43 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _babelHelperVueJsxMergeProps = _interopRequireDefault(require("@vue/babel-helper-vue-jsx-merge-props"));
var _Popup = _interopRequireDefault(require("../Popup"));
var _vnode = require("../_utils/vnode");
var _omit = _interopRequireDefault(require("../_utils/omit"));
var _utils = require("../Popup/utils");
var _PopupWrapper = require("../Popup/PopupWrapper");
var _PopoverItem = require("./PopoverItem");
var _defineComponent = require("../_utils/defineComponent");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var popoverProps = (0, _omit.default)(_PopupWrapper.popupOutSideProps, ['scrollBody', 'anchor', 'fullscreen']);
popoverProps.animate.default = 'zoom';
popoverProps.position.default = function () {
return {
vertical: 'bottom',
horizontal: 'center'
};
};
popoverProps.marginThreshold.default = 6;
popoverProps.mask.default = false;
popoverProps.closeOnMaskTouched.default = true;
var _default = exports.default = (0, _defineComponent.defineComponent)('popover').create({
model: {
prop: 'visible',
event: 'visibleChange'
},
props: _objectSpread(_objectSpread({}, popoverProps), {}, {
noArrow: (0, _defineComponent.props)(Boolean).default(false),
minArrowMargin: _defineComponent.props.ofType().default(8),
contentStyle: _defineComponent.props.ofType().optional,
contentClass: String
}),
data: function data() {
return {
popupVisible: this.visible,
arrowStyle: {}
};
},
computed: {
anchorPos: function anchorPos() {
return (0, _utils.getAnchorPosition)(this.position);
}
},
methods: {
close: function close() {
this.popupVisible = false;
this.$emit('close', this.popupVisible);
}
},
render: function render() {
var _this = this;
var h = arguments[0];
var $slots = this.$slots,
$props = this.$props,
$listeners = this.$listeners,
arrowStyle = this.arrowStyle,
anchorPos = this.anchorPos,
contentStyle = this.contentStyle,
contentClass = this.contentClass;
var cls = this.$rootCls();
var transformOrigin = (0, _utils.getTransformOrigin)(anchorPos, this.transformOrigin);
var isTop = anchorPos.vertical === 'top' && transformOrigin.vertical === 'bottom';
var isBottom = anchorPos.vertical === 'bottom' && transformOrigin.vertical === 'top';
var isLeft = anchorPos.horizontal === 'left' && transformOrigin.horizontal === 'right';
var isRight = anchorPos.horizontal === 'right' && transformOrigin.horizontal === 'left';
var popCls = cls.addClasses({
'is-top': isTop,
'is-bottom': isBottom,
'is-center-left': isLeft,
'is-center-right': isRight
});
var anchorProps = {
ref: 'anchor',
on: {
click: function click() {
_this.popupVisible = true;
}
}
};
var _anchor = $slots.anchor && (0, _vnode.cloneElement)($slots.anchor[0], anchorProps);
var popupData = {
props: _objectSpread(_objectSpread({}, $props), {}, {
visible: this.popupVisible,
anchor: function anchor() {
return _anchor.elm;
}
}),
on: _objectSpread(_objectSpread({}, $listeners), {}, {
close: function close() {
_this.close();
},
enter: function enter(_ref) {
var anchor = _ref.anchor,
doc = _ref.doc;
var anchorCentralXAxis = 0;
var anchorCentralYAxis = 0;
var style = {};
if (anchor) {
anchorCentralXAxis = anchor.width / 2 + anchor.left;
anchorCentralYAxis = anchor.height / 2 + anchor.top;
}
if (doc) {
if (isLeft || isRight) {
var arrowY = anchorCentralYAxis - doc.top;
if (arrowY < _this.minArrowMargin) {
arrowY += _this.minArrowMargin;
}
style.top = arrowY + 'px';
style[_this.anchorPos.horizontal === 'left' ? 'right' : 'left'] = '1px';
} else {
var arrowX = anchorCentralXAxis - doc.left;
if (arrowX < _this.minArrowMargin) {
arrowX += _this.minArrowMargin;
}
style.left = arrowX + 'px';
style[_this.anchorPos.vertical === 'top' ? 'bottom' : 'top'] = '1px';
}
_this.arrowStyle = style;
}
_this.$emit('enter', {
anchor: anchor,
doc: doc
});
}
})
};
var content;
if ($slots.default) {
var items = (0, _vnode.getVNodesByName)($slots.default, _PopoverItem.basePopoverItemName);
if (items.length > 0) {
content = items.map(function (item, index) {
return (0, _vnode.cloneElement)(item, {
on: {
click: function click() {
var event = {
key: item.key,
index: index
};
_this.$emit('select', event);
_this.close();
}
}
});
});
} else {
content = $slots.default;
}
}
var contentCls = cls.element('content');
if (contentClass) {
contentCls.push(contentClass);
}
return h("div", [_anchor, h(_Popup.default, (0, _babelHelperVueJsxMergeProps.default)([{}, popupData]), [h("div", {
"class": popCls
}, [!this.noArrow && h("div", {
"class": cls.element('arrow'),
"style": arrowStyle
}), content && h("div", {
"class": contentCls,
"style": contentStyle
}, [content])])])]);
}
});