UNPKG

ant-design-vue

Version:

An enterprise-class UI design language and Vue-based implementation

241 lines (214 loc) 8.14 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _extends2 = require('babel-runtime/helpers/extends'); var _extends3 = _interopRequireDefault(_extends2); var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties'); var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2); var _vueTypes = require('../../_util/vue-types'); var _vueTypes2 = _interopRequireDefault(_vueTypes); var _vcTrigger = require('../../vc-trigger'); var _vcTrigger2 = _interopRequireDefault(_vcTrigger); var _placements = require('./placements'); var _placements2 = _interopRequireDefault(_placements); var _propsUtil = require('../../_util/props-util'); var _BaseMixin = require('../../_util/BaseMixin'); var _BaseMixin2 = _interopRequireDefault(_BaseMixin); var _vnode = require('../../_util/vnode'); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } exports['default'] = { mixins: [_BaseMixin2['default']], props: { minOverlayWidthMatchTrigger: _vueTypes2['default'].bool, prefixCls: _vueTypes2['default'].string.def('rc-dropdown'), transitionName: _vueTypes2['default'].string, overlayClassName: _vueTypes2['default'].string.def(''), openClassName: _vueTypes2['default'].string, animation: _vueTypes2['default'].any, align: _vueTypes2['default'].object, overlayStyle: _vueTypes2['default'].object.def(function () { return {}; }), placement: _vueTypes2['default'].string.def('bottomLeft'), overlay: _vueTypes2['default'].any, trigger: _vueTypes2['default'].array.def(['hover']), alignPoint: _vueTypes2['default'].bool, showAction: _vueTypes2['default'].array.def([]), hideAction: _vueTypes2['default'].array.def([]), getPopupContainer: _vueTypes2['default'].func, visible: _vueTypes2['default'].bool, defaultVisible: _vueTypes2['default'].bool.def(false), mouseEnterDelay: _vueTypes2['default'].number.def(0.15), mouseLeaveDelay: _vueTypes2['default'].number.def(0.1) }, data: function data() { var sVisible = this.defaultVisible; if ((0, _propsUtil.hasProp)(this, 'visible')) { sVisible = this.visible; } return { sVisible: sVisible }; }, watch: { visible: function visible(val) { if (val !== undefined) { this.setState({ sVisible: val }); } } }, methods: { onClick: function onClick(e) { // do no call onVisibleChange, if you need click to hide, use onClick and control visible if (!(0, _propsUtil.hasProp)(this, 'visible')) { this.setState({ sVisible: false }); } this.$emit('overlayClick', e); if (this.childOriginEvents.click) { this.childOriginEvents.click(e); } }, onVisibleChange: function onVisibleChange(visible) { if (!(0, _propsUtil.hasProp)(this, 'visible')) { this.setState({ sVisible: visible }); } this.__emit('visibleChange', visible); }, getMinOverlayWidthMatchTrigger: function getMinOverlayWidthMatchTrigger() { var props = (0, _propsUtil.getOptionProps)(this); var minOverlayWidthMatchTrigger = props.minOverlayWidthMatchTrigger, alignPoint = props.alignPoint; if ('minOverlayWidthMatchTrigger' in props) { return minOverlayWidthMatchTrigger; } return !alignPoint; }, getOverlayElement: function getOverlayElement() { var overlay = this.overlay || this.$slots.overlay || this.$scopedSlots.overlay; var overlayElement = void 0; if (typeof overlay === 'function') { overlayElement = overlay(); } else { overlayElement = overlay; } return overlayElement; }, getMenuElement: function getMenuElement() { var _this = this; var onClick = this.onClick, prefixCls = this.prefixCls, $slots = this.$slots; this.childOriginEvents = (0, _propsUtil.getEvents)($slots.overlay[0]); var overlayElement = this.getOverlayElement(); var extraOverlayProps = { props: { prefixCls: prefixCls + '-menu', getPopupContainer: function getPopupContainer() { return _this.getPopupDomNode(); } }, on: { click: onClick } }; if (typeof overlayElement.type === 'string') { delete extraOverlayProps.props.prefixCls; } return (0, _vnode.cloneElement)($slots.overlay[0], extraOverlayProps); }, getMenuElementOrLambda: function getMenuElementOrLambda() { var overlay = this.overlay || this.$slots.overlay || this.$scopedSlots.overlay; if (typeof overlay === 'function') { return this.getMenuElement; } return this.getMenuElement(); }, getPopupDomNode: function getPopupDomNode() { return this.$refs.trigger.getPopupDomNode(); }, getOpenClassName: function getOpenClassName() { var _$props = this.$props, openClassName = _$props.openClassName, prefixCls = _$props.prefixCls; if (openClassName !== undefined) { return openClassName; } return prefixCls + '-open'; }, afterVisibleChange: function afterVisibleChange(visible) { if (visible && this.getMinOverlayWidthMatchTrigger()) { var overlayNode = this.getPopupDomNode(); var rootNode = this.$el; if (rootNode && overlayNode && rootNode.offsetWidth > overlayNode.offsetWidth) { overlayNode.style.minWidth = rootNode.offsetWidth + 'px'; if (this.$refs.trigger && this.$refs.trigger._component && this.$refs.trigger._component.$refs && this.$refs.trigger._component.$refs.alignInstance) { this.$refs.trigger._component.$refs.alignInstance.forceAlign(); } } } }, renderChildren: function renderChildren() { var children = this.$slots['default'] && this.$slots['default'][0]; var sVisible = this.sVisible; return sVisible && children ? (0, _vnode.cloneElement)(children, { 'class': this.getOpenClassName() }) : children; } }, render: function render() { var h = arguments[0]; var _$props2 = this.$props, prefixCls = _$props2.prefixCls, transitionName = _$props2.transitionName, animation = _$props2.animation, align = _$props2.align, placement = _$props2.placement, getPopupContainer = _$props2.getPopupContainer, showAction = _$props2.showAction, hideAction = _$props2.hideAction, overlayClassName = _$props2.overlayClassName, overlayStyle = _$props2.overlayStyle, trigger = _$props2.trigger, otherProps = (0, _objectWithoutProperties3['default'])(_$props2, ['prefixCls', 'transitionName', 'animation', 'align', 'placement', 'getPopupContainer', 'showAction', 'hideAction', 'overlayClassName', 'overlayStyle', 'trigger']); var triggerHideAction = hideAction; if (!triggerHideAction && trigger.indexOf('contextmenu') !== -1) { triggerHideAction = ['click']; } var triggerProps = { props: (0, _extends3['default'])({}, otherProps, { prefixCls: prefixCls, popupClassName: overlayClassName, popupStyle: overlayStyle, builtinPlacements: _placements2['default'], action: trigger, showAction: showAction, hideAction: triggerHideAction || [], popupPlacement: placement, popupAlign: align, popupTransitionName: transitionName, popupAnimation: animation, popupVisible: this.sVisible, afterPopupVisibleChange: this.afterVisibleChange, getPopupContainer: getPopupContainer }), on: { popupVisibleChange: this.onVisibleChange }, ref: 'trigger' }; return h( _vcTrigger2['default'], triggerProps, [this.renderChildren(), h( 'template', { slot: 'popup' }, [this.$slots.overlay && this.getMenuElement()] )] ); } };