2 lines
13 KiB
JavaScript
2 lines
13 KiB
JavaScript
import t,{Component as e}from"react";import n from"react-dom";import{DomHandler as i,ZIndexUtils as o,ConnectedOverlayScrollHandler as r,classNames as s}from"primereact/utils";import{Portal as a}from"primereact/portal";import l from"primereact/api";function u(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function c(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}function p(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}function h(t,e){return h=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t},h(t,e)}function d(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&h(t,e)}function f(t){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},f(t)}function v(t,e){if(e&&("object"===f(e)||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return p(t)}function g(t){return g=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)},g(t)}function y(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function m(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}function T(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(t);e&&(i=i.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,i)}return n}function b(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?T(Object(n),!0).forEach((function(e){y(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):T(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function E(e){var o=e.appendTo||document.body,r=document.createDocumentFragment();i.appendChild(r,o),e=b(b({},e),e.options);var s=t.createElement(w,e);n.render(s,r);var a=function(i){e=b(b({},e),i),n.render(t.cloneElement(s,e),r)};return{destroy:function(){n.unmountComponentAtNode(r)},updateContent:function(t){console.warn("The 'updateContent' method has been deprecated on Tooltip. Use update(newProps) method."),a({content:t})},update:function(t){a(t)}}}var w=function(h){d(k,e);var f,T,b,E,w,O=(f=k,T=m(),function(){var t,e=g(f);if(T){var n=g(this).constructor;t=Reflect.construct(e,arguments,n)}else t=e.apply(this,arguments);return v(this,t)});function k(t){var e;return u(this,k),(e=O.call(this,t)).state={visible:!1,position:e.props.position},e.show=e.show.bind(p(e)),e.hide=e.hide.bind(p(e)),e.onMouseEnter=e.onMouseEnter.bind(p(e)),e.onMouseLeave=e.onMouseLeave.bind(p(e)),e}return b=k,E=[{key:"isTargetContentEmpty",value:function(t){return!(this.props.content||this.getTargetOption(t,"tooltip"))}},{key:"isContentEmpty",value:function(t){return!(this.props.content||this.getTargetOption(t,"tooltip")||this.props.children)}},{key:"isMouseTrack",value:function(t){return this.getTargetOption(t,"mousetrack")||this.props.mouseTrack}},{key:"isDisabled",value:function(t){return"true"===this.getTargetOption(t,"disabled")||this.hasTargetOption(t,"disabled")||this.props.disabled}},{key:"isShowOnDisabled",value:function(t){return this.getTargetOption(t,"showondisabled")||this.props.showOnDisabled}},{key:"isAutoHide",value:function(){return this.getTargetOption(this.currentTarget,"autohide")||this.props.autoHide}},{key:"getTargetOption",value:function(t,e){return this.hasTargetOption(t,"data-pr-".concat(e))?t.getAttribute("data-pr-".concat(e)):null}},{key:"hasTargetOption",value:function(t,e){return t&&t.hasAttribute(e)}},{key:"getEvents",value:function(t){var e=this.getTargetOption(t,"showevent")||this.props.showEvent,n=this.getTargetOption(t,"hideevent")||this.props.hideEvent;return this.isMouseTrack(t)?(e="mousemove",n="mouseleave"):"focus"===(this.getTargetOption(t,"event")||this.props.event)&&(e="focus",n="blur"),{showEvent:e,hideEvent:n}}},{key:"getPosition",value:function(t){return this.getTargetOption(t,"position")||this.state.position}},{key:"getMouseTrackPosition",value:function(t){return{top:this.getTargetOption(t,"mousetracktop")||this.props.mouseTrackTop,left:this.getTargetOption(t,"mousetrackleft")||this.props.mouseTrackLeft}}},{key:"updateText",value:function(t,e){if(this.tooltipTextEl){var n=this.getTargetOption(t,"tooltip")||this.props.content;n?(this.tooltipTextEl.innerHTML="",this.tooltipTextEl.appendChild(document.createTextNode(n)),e()):this.props.children&&e()}}},{key:"show",value:function(t){var e=this;this.currentTarget=t.currentTarget;var n=this.isDisabled(this.currentTarget);if(!this.isContentEmpty(this.isShowOnDisabled(this.currentTarget)&&n?this.currentTarget.firstChild:this.currentTarget)&&!n){var r=function(){e.updateText(e.currentTarget,(function(){e.props.autoZIndex&&!o.get(e.containerEl)&&o.set("tooltip",e.containerEl,l.autoZIndex,e.props.baseZIndex||l.zIndex.tooltip),e.containerEl.style.left="",e.containerEl.style.top="",e.isMouseTrack(e.currentTarget)&&!e.containerSize&&(e.containerSize={width:i.getOuterWidth(e.containerEl),height:i.getOuterHeight(e.containerEl)}),e.align(e.currentTarget,{x:t.pageX,y:t.pageY})}))};this.state.visible?this.applyDelay("updateDelay",r):(this.sendCallback(this.props.onBeforeShow,{originalEvent:t,target:this.currentTarget}),this.applyDelay("showDelay",(function(){e.setState({visible:!0,position:e.getPosition(e.currentTarget)},(function(){r(),e.sendCallback(e.props.onShow,{originalEvent:t,target:e.currentTarget})})),e.bindDocumentResizeListener(),e.bindScrollListener(),i.addClass(e.currentTarget,e.getTargetOption(e.currentTarget,"classname"))})))}}},{key:"hide",value:function(t){var e=this;this.clearTimeouts(),this.state.visible&&(i.removeClass(this.currentTarget,this.getTargetOption(this.currentTarget,"classname")),this.sendCallback(this.props.onBeforeHide,{originalEvent:t,target:this.currentTarget}),this.applyDelay("hideDelay",(function(){o.clear(e.containerEl),i.removeClass(e.containerEl,"p-tooltip-active"),(e.isAutoHide()||!1!==e.allowHide)&&e.setState({visible:!1,position:e.props.position},(function(){e.tooltipTextEl&&n.unmountComponentAtNode(e.tooltipTextEl),e.unbindDocumentResizeListener(),e.unbindScrollListener(),e.currentTarget=null,e.scrollHandler=null,e.containerSize=null,e.allowHide=!0,e.sendCallback(e.props.onHide,{originalEvent:t,target:e.currentTarget})}))})))}},{key:"align",value:function(t,e){var n=this,o=0,r=0;if(this.isMouseTrack(t)&&e){var s={width:i.getOuterWidth(this.containerEl),height:i.getOuterHeight(this.containerEl)};o=e.x,r=e.y;var a=this.getMouseTrackPosition(t),l=a.top,u=a.left;switch(this.state.position){case"left":o-=s.width+u,r-=s.height/2-l;break;case"right":o+=u,r-=s.height/2-l;break;case"top":o-=s.width/2-u,r-=s.height+l;break;case"bottom":o-=s.width/2-u,r+=l}o<=0||this.containerSize.width>s.width?(this.containerEl.style.left="0px",this.containerEl.style.right=window.innerWidth-s.width-o+"px"):(this.containerEl.style.right="",this.containerEl.style.left=o+"px"),this.containerEl.style.top=r+"px",i.addClass(this.containerEl,"p-tooltip-active")}else{var c=i.findCollisionPosition(this.state.position),p=this.getTargetOption(t,"my")||this.props.my||c.my,h=this.getTargetOption(t,"at")||this.props.at||c.at;this.containerEl.style.padding="0px",i.flipfitCollision(this.containerEl,t,p,h,(function(t){var e=t.at,o=e.x,r=n.props.at?"center"!==o&&o!==t.my.x?o:e.y:t.at["".concat(c.axis)];n.containerEl.style.padding="",n.setState({position:r},(function(){n.updateContainerPosition(),i.addClass(n.containerEl,"p-tooltip-active")}))}))}}},{key:"updateContainerPosition",value:function(){if(this.containerEl){var t=getComputedStyle(this.containerEl);"left"===this.state.position?this.containerEl.style.left=parseFloat(t.left)-2*parseFloat(t.paddingLeft)+"px":"top"===this.state.position&&(this.containerEl.style.top=parseFloat(t.top)-2*parseFloat(t.paddingTop)+"px")}}},{key:"onMouseEnter",value:function(){this.isAutoHide()||(this.allowHide=!1)}},{key:"onMouseLeave",value:function(t){this.isAutoHide()||(this.allowHide=!0,this.hide(t))}},{key:"bindDocumentResizeListener",value:function(){var t=this;this.documentResizeListener=function(e){i.isTouchDevice()||t.hide(e)},window.addEventListener("resize",this.documentResizeListener)}},{key:"unbindDocumentResizeListener",value:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},{key:"bindScrollListener",value:function(){var t=this;this.scrollHandler||(this.scrollHandler=new r(this.currentTarget,(function(e){t.state.visible&&t.hide(e)}))),this.scrollHandler.bindScrollListener()}},{key:"unbindScrollListener",value:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()}},{key:"bindTargetEvent",value:function(t){if(t){var e=this.getEvents(t),n=e.showEvent,i=e.hideEvent,o=this.getTarget(t);o.addEventListener(n,this.show),o.addEventListener(i,this.hide)}}},{key:"unbindTargetEvent",value:function(t){if(t){var e=this.getEvents(t),n=e.showEvent,i=e.hideEvent,o=this.getTarget(t);o.removeEventListener(n,this.show),o.removeEventListener(i,this.hide)}}},{key:"applyDelay",value:function(t,e){this.clearTimeouts();var n=this.getTargetOption(this.currentTarget,t.toLowerCase())||this.props[t];n?this["".concat(t,"Timeout")]=setTimeout((function(){return e()}),n):e()}},{key:"sendCallback",value:function(t){if(t){for(var e=arguments.length,n=new Array(e>1?e-1:0),i=1;i<e;i++)n[i-1]=arguments[i];t.apply(void 0,n)}}},{key:"clearTimeouts",value:function(){clearTimeout(this.showDelayTimeout),clearTimeout(this.updateDelayTimeout),clearTimeout(this.hideDelayTimeout)}},{key:"getTarget",value:function(t){if(t){if(this.isShowOnDisabled(t)){var e=document.createElement("span");return t.parentNode.insertBefore(e,t),e.appendChild(t),e}return t}return null}},{key:"updateTargetEvents",value:function(t){this.unloadTargetEvents(t),this.loadTargetEvents(t)}},{key:"loadTargetEvents",value:function(t){this.setTargetEventOperations(t||this.props.target,"bindTargetEvent")}},{key:"unloadTargetEvents",value:function(t){this.setTargetEventOperations(t||this.props.target,"unbindTargetEvent")}},{key:"setTargetEventOperations",value:function(t,e){var n=this;if(t)if(i.isElement(t))this[e](t);else{var o=function(t){i.find(document,t).forEach((function(t){n[e](t)}))};t instanceof Array?t.forEach((function(t){o(t)})):o(t)}}},{key:"componentDidMount",value:function(){this.props.target&&this.loadTargetEvents()}},{key:"componentDidUpdate",value:function(t,e){var n=this;t.target!==this.props.target&&(this.unloadTargetEvents(t.target),this.loadTargetEvents()),this.state.visible&&(t.content!==this.props.content&&this.applyDelay("updateDelay",(function(){n.updateText(n.currentTarget,(function(){n.align(n.currentTarget)}))})),this.currentTarget&&this.isDisabled(this.currentTarget)&&this.hide())}},{key:"componentWillUnmount",value:function(){this.clearTimeouts(),this.unbindDocumentResizeListener(),this.unloadTargetEvents(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),o.clear(this.containerEl)}},{key:"renderElement",value:function(){var e=this,n=s("p-tooltip p-component",y({},"p-tooltip-".concat(this.state.position),!0),this.props.className),i=this.isTargetContentEmpty(this.currentTarget);return t.createElement("div",{id:this.props.id,ref:function(t){return e.containerEl=t},className:n,style:this.props.style,role:"tooltip","aria-hidden":this.state.visible,onMouseEnter:this.onMouseEnter,onMouseLeave:this.onMouseLeave},t.createElement("div",{className:"p-tooltip-arrow"}),t.createElement("div",{ref:function(t){return e.tooltipTextEl=t},className:"p-tooltip-text"},i&&this.props.children))}},{key:"render",value:function(){if(this.state.visible){var e=this.renderElement();return t.createElement(a,{element:e,appendTo:this.props.appendTo,visible:!0})}return null}}],E&&c(b.prototype,E),w&&c(b,w),Object.defineProperty(b,"prototype",{writable:!1}),k}();y(w,"defaultProps",{id:null,target:null,content:null,disabled:!1,className:null,style:null,appendTo:null,position:"right",my:null,at:null,event:null,showEvent:"mouseenter",hideEvent:"mouseleave",autoZIndex:!0,baseZIndex:0,mouseTrack:!1,mouseTrackTop:5,mouseTrackLeft:5,showDelay:0,updateDelay:0,hideDelay:0,autoHide:!0,showOnDisabled:!1,onBeforeShow:null,onBeforeHide:null,onShow:null,onHide:null});export{w as Tooltip,E as tip};
|