UNPKG

ll-package

Version:

2 lines (1 loc) 12.1 kB
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("../../../@babel/runtime/helpers/esm/extends.js"),u=require("vue"),P=require("./interface.js"),h=require("../vc-util/Dom/contains.js"),g=require("../_util/raf.js"),l=require("../_util/props-util/index.js"),d=require("../vc-util/Dom/addEventListener.js"),V=require("./Popup/index.js"),T=require("./utils/alignUtil.js"),y=require("../_util/BaseMixin.js"),N=require("../_util/PortalWrapper.js"),E=require("../_util/classNames.js"),S=require("../_util/vnode.js"),m=require("../_util/supportsPassive.js"),A=require("./context.js"),R=["onClick","onMousedown","onTouchstart","onMouseenter","onMouseleave","onFocus","onBlur","onContextmenu"],F=u.defineComponent({compatConfig:{MODE:3},name:"Trigger",mixins:[y.default],inheritAttrs:!1,props:P.triggerProps(),setup(e){const t=u.computed(()=>{const{popupPlacement:n,popupAlign:i,builtinPlacements:r}=e;return n&&r?T.getAlignFromPlacement(r,n,i):i}),o=u.shallowRef(null),s=n=>{o.value=n};return{vcTriggerContext:u.inject("vcTriggerContext",{}),popupRef:o,setPopupRef:s,triggerRef:u.shallowRef(null),align:t,focusTime:null,clickOutsideHandler:null,contextmenuOutsideHandler1:null,contextmenuOutsideHandler2:null,touchOutsideHandler:null,attachId:null,delayTimer:null,hasPopupMouseDown:!1,preClickTime:null,preTouchTime:null,mouseDownTimeout:null,childOriginEvents:{}}},data(){const e=this.$props;let t;return this.popupVisible!==void 0?t=!!e.popupVisible:t=!!e.defaultPopupVisible,R.forEach(o=>{this[`fire${o}`]=s=>{this.fireEvents(o,s)}}),{prevPopupVisible:t,sPopupVisible:t,point:null}},watch:{popupVisible(e){e!==void 0&&(this.prevPopupVisible=this.sPopupVisible,this.sPopupVisible=e)}},created(){u.provide("vcTriggerContext",{onPopupMouseDown:this.onPopupMouseDown,onPopupMouseenter:this.onPopupMouseenter,onPopupMouseleave:this.onPopupMouseleave}),A.useProvidePortal(this)},deactivated(){this.setPopupVisible(!1)},mounted(){this.$nextTick(()=>{this.updatedCal()})},updated(){this.$nextTick(()=>{this.updatedCal()})},beforeUnmount(){this.clearDelayTimer(),this.clearOutsideHandler(),clearTimeout(this.mouseDownTimeout),g.default.cancel(this.attachId)},methods:{updatedCal(){const e=this.$props;if(this.$data.sPopupVisible){let o;!this.clickOutsideHandler&&(this.isClickToHide()||this.isContextmenuToShow())&&(o=e.getDocument(this.getRootDomNode()),this.clickOutsideHandler=d.default(o,"mousedown",this.onDocumentClick)),this.touchOutsideHandler||(o=o||e.getDocument(this.getRootDomNode()),this.touchOutsideHandler=d.default(o,"touchstart",this.onDocumentClick,m.default?{passive:!1}:!1)),!this.contextmenuOutsideHandler1&&this.isContextmenuToShow()&&(o=o||e.getDocument(this.getRootDomNode()),this.contextmenuOutsideHandler1=d.default(o,"scroll",this.onContextmenuClose)),!this.contextmenuOutsideHandler2&&this.isContextmenuToShow()&&(this.contextmenuOutsideHandler2=d.default(window,"blur",this.onContextmenuClose))}else this.clearOutsideHandler()},onMouseenter(e){const{mouseEnterDelay:t}=this.$props;this.fireEvents("onMouseenter",e),this.delaySetPopupVisible(!0,t,t?null:e)},onMouseMove(e){this.fireEvents("onMousemove",e),this.setPoint(e)},onMouseleave(e){this.fireEvents("onMouseleave",e),this.delaySetPopupVisible(!1,this.$props.mouseLeaveDelay)},onPopupMouseenter(){const{vcTriggerContext:e={}}=this;e.onPopupMouseenter&&e.onPopupMouseenter(),this.clearDelayTimer()},onPopupMouseleave(e){var t;if(e&&e.relatedTarget&&!e.relatedTarget.setTimeout&&h.default((t=this.popupRef)===null||t===void 0?void 0:t.getElement(),e.relatedTarget))return;this.isMouseLeaveToHide()&&this.delaySetPopupVisible(!1,this.$props.mouseLeaveDelay);const{vcTriggerContext:o={}}=this;o.onPopupMouseleave&&o.onPopupMouseleave(e)},onFocus(e){this.fireEvents("onFocus",e),this.clearDelayTimer(),this.isFocusToShow()&&(this.focusTime=Date.now(),this.delaySetPopupVisible(!0,this.$props.focusDelay))},onMousedown(e){this.fireEvents("onMousedown",e),this.preClickTime=Date.now()},onTouchstart(e){this.fireEvents("onTouchstart",e),this.preTouchTime=Date.now()},onBlur(e){h.default(e.target,e.relatedTarget||document.activeElement)||(this.fireEvents("onBlur",e),this.clearDelayTimer(),this.isBlurToHide()&&this.delaySetPopupVisible(!1,this.$props.blurDelay))},onContextmenu(e){e.preventDefault(),this.fireEvents("onContextmenu",e),this.setPopupVisible(!0,e)},onContextmenuClose(){this.isContextmenuToShow()&&this.close()},onClick(e){if(this.fireEvents("onClick",e),this.focusTime){let o;if(this.preClickTime&&this.preTouchTime?o=Math.min(this.preClickTime,this.preTouchTime):this.preClickTime?o=this.preClickTime:this.preTouchTime&&(o=this.preTouchTime),Math.abs(o-this.focusTime)<20)return;this.focusTime=0}this.preClickTime=0,this.preTouchTime=0,this.isClickToShow()&&(this.isClickToHide()||this.isBlurToHide())&&e&&e.preventDefault&&e.preventDefault(),e&&e.domEvent&&e.domEvent.preventDefault();const t=!this.$data.sPopupVisible;(this.isClickToHide()&&!t||t&&this.isClickToShow())&&this.setPopupVisible(!this.$data.sPopupVisible,e)},onPopupMouseDown(){const{vcTriggerContext:e={}}=this;this.hasPopupMouseDown=!0,clearTimeout(this.mouseDownTimeout),this.mouseDownTimeout=setTimeout(()=>{this.hasPopupMouseDown=!1},0),e.onPopupMouseDown&&e.onPopupMouseDown(...arguments)},onDocumentClick(e){if(this.$props.mask&&!this.$props.maskClosable)return;const t=e.target,o=this.getRootDomNode(),s=this.getPopupDomNode();(!h.default(o,t)||this.isContextMenuOnly())&&!h.default(s,t)&&!this.hasPopupMouseDown&&this.delaySetPopupVisible(!1,.1)},getPopupDomNode(){var e;return((e=this.popupRef)===null||e===void 0?void 0:e.getElement())||null},getRootDomNode(){var e,t,o,s;const{getTriggerDOMNode:n}=this.$props;if(n){const i=((t=(e=this.triggerRef)===null||e===void 0?void 0:e.$el)===null||t===void 0?void 0:t.nodeName)==="#comment"?null:l.findDOMNode(this.triggerRef);return l.findDOMNode(n(i))}try{const i=((s=(o=this.triggerRef)===null||o===void 0?void 0:o.$el)===null||s===void 0?void 0:s.nodeName)==="#comment"?null:l.findDOMNode(this.triggerRef);if(i)return i}catch{}return l.findDOMNode(this)},handleGetPopupClassFromAlign(e){const t=[],o=this.$props,{popupPlacement:s,builtinPlacements:n,prefixCls:i,alignPoint:r,getPopupClassNameFromAlign:p}=o;return s&&n&&t.push(T.getAlignPopupClassName(n,i,e,r)),p&&t.push(p(e)),t.join(" ")},getPopupAlign(){const e=this.$props,{popupPlacement:t,popupAlign:o,builtinPlacements:s}=e;return t&&s?T.getAlignFromPlacement(s,t,o):o},getComponent(){const e={};this.isMouseEnterToShow()&&(e.onMouseenter=this.onPopupMouseenter),this.isMouseLeaveToHide()&&(e.onMouseleave=this.onPopupMouseleave),e.onMousedown=this.onPopupMouseDown,e[m.default?"onTouchstartPassive":"onTouchstart"]=this.onPopupMouseDown;const{handleGetPopupClassFromAlign:t,getRootDomNode:o,$attrs:s}=this,{prefixCls:n,destroyPopupOnHide:i,popupClassName:r,popupAnimation:p,popupTransitionName:f,popupStyle:a,mask:C,maskAnimation:v,maskTransitionName:M,zIndex:x,stretch:w,alignPoint:D,mobile:O,forceRender:b}=this.$props,{sPopupVisible:k,point:$}=this.$data,H=c.default(c.default({prefixCls:n,destroyPopupOnHide:i,visible:k,point:D?$:null,align:this.align,animation:p,getClassNameFromAlign:t,stretch:w,getRootDomNode:o,mask:C,zIndex:x,transitionName:f,maskAnimation:v,maskTransitionName:M,class:r,style:a,onAlign:s.onPopupAlign||P.noop},e),{ref:this.setPopupRef,mobile:O,forceRender:b});return u.createVNode(V.default,H,{default:this.$slots.popup||(()=>l.getComponent(this,"popup"))})},attachParent(e){g.default.cancel(this.attachId);const{getPopupContainer:t,getDocument:o}=this.$props,s=this.getRootDomNode();let n;t?(s||t.length===0)&&(n=t(s)):n=o(this.getRootDomNode()).body,n?n.appendChild(e):this.attachId=g.default(()=>{this.attachParent(e)})},getContainer(){const{$props:e}=this,{getDocument:t}=e,o=t(this.getRootDomNode()).createElement("div");return o.style.position="absolute",o.style.top="0",o.style.left="0",o.style.width="100%",this.attachParent(o),o},setPopupVisible(e,t){const{alignPoint:o,sPopupVisible:s,onPopupVisibleChange:n}=this;this.clearDelayTimer(),s!==e&&(l.hasProp(this,"popupVisible")||this.setState({sPopupVisible:e,prevPopupVisible:s}),n&&n(e)),o&&t&&e&&this.setPoint(t)},setPoint(e){const{alignPoint:t}=this.$props;!t||!e||this.setState({point:{pageX:e.pageX,pageY:e.pageY}})},handlePortalUpdate(){this.prevPopupVisible!==this.sPopupVisible&&this.afterPopupVisibleChange(this.sPopupVisible)},delaySetPopupVisible(e,t,o){const s=t*1e3;if(this.clearDelayTimer(),s){const n=o?{pageX:o.pageX,pageY:o.pageY}:null;this.delayTimer=setTimeout(()=>{this.setPopupVisible(e,n),this.clearDelayTimer()},s)}else this.setPopupVisible(e,o)},clearDelayTimer(){this.delayTimer&&(clearTimeout(this.delayTimer),this.delayTimer=null)},clearOutsideHandler(){this.clickOutsideHandler&&(this.clickOutsideHandler.remove(),this.clickOutsideHandler=null),this.contextmenuOutsideHandler1&&(this.contextmenuOutsideHandler1.remove(),this.contextmenuOutsideHandler1=null),this.contextmenuOutsideHandler2&&(this.contextmenuOutsideHandler2.remove(),this.contextmenuOutsideHandler2=null),this.touchOutsideHandler&&(this.touchOutsideHandler.remove(),this.touchOutsideHandler=null)},createTwoChains(e){let t=()=>{};const o=l.getEvents(this);return this.childOriginEvents[e]&&o[e]?this[`fire${e}`]:(t=this.childOriginEvents[e]||o[e]||t,t)},isClickToShow(){const{action:e,showAction:t}=this.$props;return e.indexOf("click")!==-1||t.indexOf("click")!==-1},isContextMenuOnly(){const{action:e}=this.$props;return e==="contextmenu"||e.length===1&&e[0]==="contextmenu"},isContextmenuToShow(){const{action:e,showAction:t}=this.$props;return e.indexOf("contextmenu")!==-1||t.indexOf("contextmenu")!==-1},isClickToHide(){const{action:e,hideAction:t}=this.$props;return e.indexOf("click")!==-1||t.indexOf("click")!==-1},isMouseEnterToShow(){const{action:e,showAction:t}=this.$props;return e.indexOf("hover")!==-1||t.indexOf("mouseenter")!==-1},isMouseLeaveToHide(){const{action:e,hideAction:t}=this.$props;return e.indexOf("hover")!==-1||t.indexOf("mouseleave")!==-1},isFocusToShow(){const{action:e,showAction:t}=this.$props;return e.indexOf("focus")!==-1||t.indexOf("focus")!==-1},isBlurToHide(){const{action:e,hideAction:t}=this.$props;return e.indexOf("focus")!==-1||t.indexOf("blur")!==-1},forcePopupAlign(){var e;this.$data.sPopupVisible&&((e=this.popupRef)===null||e===void 0||e.forceAlign())},fireEvents(e,t){this.childOriginEvents[e]&&this.childOriginEvents[e](t);const o=this.$props[e]||this.$attrs[e];o&&o(t)},close(){this.setPopupVisible(!1)}},render(){const{$attrs:e}=this,t=l.filterEmpty(l.getSlot(this)),{alignPoint:o,getPopupContainer:s}=this.$props,n=t[0];this.childOriginEvents=l.getEvents(n);const i={key:"trigger"};this.isContextmenuToShow()?i.onContextmenu=this.onContextmenu:i.onContextmenu=this.createTwoChains("onContextmenu"),this.isClickToHide()||this.isClickToShow()?(i.onClick=this.onClick,i.onMousedown=this.onMousedown,i[m.default?"onTouchstartPassive":"onTouchstart"]=this.onTouchstart):(i.onClick=this.createTwoChains("onClick"),i.onMousedown=this.createTwoChains("onMousedown"),i[m.default?"onTouchstartPassive":"onTouchstart"]=this.createTwoChains("onTouchstart")),this.isMouseEnterToShow()?(i.onMouseenter=this.onMouseenter,o&&(i.onMousemove=this.onMouseMove)):i.onMouseenter=this.createTwoChains("onMouseenter"),this.isMouseLeaveToHide()?i.onMouseleave=this.onMouseleave:i.onMouseleave=this.createTwoChains("onMouseleave"),this.isFocusToShow()||this.isBlurToHide()?(i.onFocus=this.onFocus,i.onBlur=this.onBlur):(i.onFocus=this.createTwoChains("onFocus"),i.onBlur=a=>{a&&(!a.relatedTarget||!h.default(a.target,a.relatedTarget))&&this.createTwoChains("onBlur")(a)});const r=E.default(n&&n.props&&n.props.class,e.class);r&&(i.class=r);const p=S.cloneElement(n,c.default(c.default({},i),{ref:"triggerRef"}),!0,!0),f=u.createVNode(N.default,{key:"portal",getContainer:s&&(()=>s(this.getRootDomNode())),didUpdate:this.handlePortalUpdate,visible:this.$data.sPopupVisible},{default:this.getComponent});return u.createVNode(u.Fragment,null,[p,f])}});exports.default=F;