import _extends from"@babel/runtime/helpers/esm/extends";import _objectWithoutPropertiesLoose from"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";import*as React from"react";import PropTypes from"prop-types";import clsx from"clsx";import{deepmerge,elementAcceptingRef}from"@material-ui/utils";import{alpha}from"../styles/colorManipulator";import withStyles from"../styles/withStyles";import capitalize from"../utils/capitalize";import Grow from"../Grow";import Popper from"../Popper";import useEventCallback from"../utils/useEventCallback";import useForkRef from"../utils/useForkRef";import useId from"../utils/useId";import useIsFocusVisible from"../utils/useIsFocusVisible";import useControlled from"../utils/useControlled";import useTheme from"../styles/useTheme";function round(e){return Math.round(1e5*e)/1e5}function arrowGenerator(){return{'&[data-popper-placement*="bottom"] $arrow':{top:0,left:0,marginTop:"-0.71em","&::before":{transformOrigin:"0 100%"}},'&[data-popper-placement*="top"] $arrow':{bottom:0,left:0,marginBottom:"-0.71em","&::before":{transformOrigin:"100% 0"}},'&[data-popper-placement*="right"] $arrow':{left:0,marginLeft:"-0.71em",height:"1em",width:"0.71em","&::before":{transformOrigin:"100% 100%"}},'&[data-popper-placement*="left"] $arrow':{right:0,marginRight:"-0.71em",height:"1em",width:"0.71em","&::before":{transformOrigin:"0 0"}}}}export const styles=e=>({popper:{zIndex:e.zIndex.tooltip,pointerEvents:"none"},popperInteractive:{pointerEvents:"auto"},popperArrow:arrowGenerator(),tooltip:{backgroundColor:alpha(e.palette.grey[700],.92),borderRadius:e.shape.borderRadius,color:e.palette.common.white,fontFamily:e.typography.fontFamily,padding:"4px 8px",fontSize:e.typography.pxToRem(11),maxWidth:300,wordWrap:"break-word",fontWeight:e.typography.fontWeightMedium},tooltipArrow:{position:"relative",margin:"0"},arrow:{overflow:"hidden",position:"absolute",width:"1em",height:"0.71em",boxSizing:"border-box",color:alpha(e.palette.grey[700],.9),"&::before":{content:'""',margin:"auto",display:"block",width:"100%",height:"100%",backgroundColor:"currentColor",transform:"rotate(45deg)"}},touch:{padding:"8px 16px",fontSize:e.typography.pxToRem(14),lineHeight:`${round(16/14)}em`,fontWeight:e.typography.fontWeightRegular},tooltipPlacementLeft:{transformOrigin:"right center",margin:"0 24px ",[e.breakpoints.up("sm")]:{margin:"0 14px"}},tooltipPlacementRight:{transformOrigin:"left center",margin:"0 24px",[e.breakpoints.up("sm")]:{margin:"0 14px"}},tooltipPlacementTop:{transformOrigin:"center bottom",margin:"24px 0",[e.breakpoints.up("sm")]:{margin:"14px 0"}},tooltipPlacementBottom:{transformOrigin:"center top",margin:"24px 0",[e.breakpoints.up("sm")]:{margin:"14px 0"}}});let hystersisOpen=!1,hystersisTimer=null;export function testReset(){hystersisOpen=!1,clearTimeout(hystersisTimer)};function composeEventHandler(e,t){return o=>{t&&t(o),e(o)}}const Tooltip=React.forwardRef(function(e,t){const{arrow:o=!1,children:r,classes:n,describeChild:s=!1,disableFocusListener:i=!1,disableHoverListener:p=!1,disableTouchListener:a=!1,enterDelay:l=100,enterNextDelay:c=0,enterTouchDelay:u=700,followCursor:m=!1,id:d,disableInteractive:h=!1,leaveDelay:f=0,leaveTouchDelay:T=1500,onClose:y,onOpen:b,open:g,placement:R="bottom",PopperComponent:v=Popper,PopperProps:P,title:w,TransitionComponent:x=Grow,TransitionProps:E}=e,C=_objectWithoutPropertiesLoose(e,["arrow","children","classes","describeChild","disableFocusListener","disableHoverListener","disableTouchListener","enterDelay","enterNextDelay","enterTouchDelay","followCursor","id","disableInteractive","leaveDelay","leaveTouchDelay","onClose","onOpen","open","placement","PopperComponent","PopperProps","title","TransitionComponent","TransitionProps"]),O=useTheme(),[k,L]=React.useState(),[M,D]=React.useState(null),F=React.useRef(!1),N=h||m,I=React.useRef(),S=React.useRef(),A=React.useRef(),_=React.useRef(),[j,H]=useControlled({controlled:g,default:!1,name:"Tooltip",state:"open"});let W=j;if("production"!==process.env.NODE_ENV){const{current:e}=React.useRef(void 0!==g);React.useEffect(()=>{k&&k.disabled&&!e&&""!==w&&"button"===k.tagName.toLowerCase()&&console.error(["Material-UI: You are providing a disabled `button` child to the Tooltip component.","A disabled element does not fire events.","Tooltip needs to listen to the child element's events to display the title.","","Add a simple wrapper element, such as a `span`."].join("\n"))},[w,k,e])}const z=useId(d);React.useEffect(()=>()=>{clearTimeout(I.current),clearTimeout(S.current),clearTimeout(A.current),clearTimeout(_.current)},[]);const B=e=>{clearTimeout(hystersisTimer),hystersisOpen=!0,H(!0),b&&b(e)},V=useEventCallback(e=>{clearTimeout(hystersisTimer),hystersisTimer=setTimeout(()=>{hystersisOpen=!1},800+f),H(!1),y&&y(e),clearTimeout(I.current),I.current=setTimeout(()=>{F.current=!1},O.transitions.duration.shortest)}),$=e=>{F.current&&"touchstart"!==e.type||(k&&k.removeAttribute("title"),clearTimeout(S.current),clearTimeout(A.current),l||hystersisOpen&&c?(e.persist(),S.current=setTimeout(()=>{B(e)},hystersisOpen?c:l)):B(e))},G=e=>{clearTimeout(S.current),clearTimeout(A.current),e.persist(),A.current=setTimeout(()=>{V(e)},f)},{isFocusVisibleRef:U,onBlur:Y,onFocus:q,ref:X}=useIsFocusVisible(),[,J]=React.useState(!1),K=e=>{Y(e),!1===U.current&&(J(!1),G(e))},Q=e=>{k||L(e.currentTarget),q(e),!0===U.current&&(J(!0),$(e))},Z=e=>{F.current=!0;const t=r.props;t.onTouchStart&&t.onTouchStart(e)},ee=$,te=G,oe=e=>{Z(e),clearTimeout(A.current),clearTimeout(I.current),clearTimeout(_.current),e.persist(),_.current=setTimeout(()=>{$(e)},u)},re=e=>{r.props.onTouchEnd&&r.props.onTouchEnd(e),clearTimeout(_.current),clearTimeout(A.current),e.persist(),A.current=setTimeout(()=>{V(e)},T)};React.useEffect(()=>{if(W)return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)};function e(e){"Escape"!==e.key&&"Esc"!==e.key||V(e)}},[V,W]);const ne=useForkRef(L,t),se=useForkRef(X,ne),ie=useForkRef(r.ref,se);""===w&&(W=!1);const pe=React.useRef({x:0,y:0}),ae=React.useRef(),le={},ce="string"==typeof w;s?(le.title=W||!ce||p?null:w,le["aria-describedby"]=W?z:null):(le["aria-label"]=ce?w:null,le["aria-labelledby"]=W&&!ce?z:null);const ue=_extends({},le,C,r.props,{className:clsx(C.className,r.props.className),onTouchStart:Z,ref:ie},m?{onMouseMove:e=>{const t=r.props;t.onMouseMove&&t.onMouseMove(e),pe.current={x:e.clientX,y:e.clientY},ae.current&&ae.current.update()}}:{});"production"!==process.env.NODE_ENV&&(ue["data-mui-internal-clone-element"]=!0,React.useEffect(()=>{k&&!k.getAttribute("data-mui-internal-clone-element")&&console.error(["Material-UI: The `children` component of the Tooltip is not forwarding its props correctly.","Please make sure that props are spread on the same element that the ref is applied to."].join("\n"))},[k]));const me={};a||(ue.onTouchStart=oe,ue.onTouchEnd=re),p||(ue.onMouseOver=composeEventHandler(ee,ue.onMouseOver),ue.onMouseLeave=composeEventHandler(te,ue.onMouseLeave),N||(me.onMouseOver=ee,me.onMouseLeave=te)),i||(ue.onFocus=composeEventHandler(Q,ue.onFocus),ue.onBlur=composeEventHandler(K,ue.onBlur),N||(me.onFocus=Q,me.onBlur=K)),"production"!==process.env.NODE_ENV&&r.props.title&&console.error(["Material-UI: You have provided a `title` prop to the child of <Tooltip />.",`Remove this title prop \`${r.props.title}\` or the Tooltip component.`].join("\n"));const de=React.useMemo(()=>deepmerge({popperOptions:{modifiers:[{name:"arrow",enabled:Boolean(M),options:{element:M,padding:4}}]}},P),[M,P]);return React.createElement(React.Fragment,null,React.cloneElement(r,ue),React.createElement(v,_extends({className:clsx(n.popper,!N&&n.popperInteractive,o&&n.popperArrow),placement:R,anchorEl:m?{getBoundingClientRect:()=>({top:pe.current.y,left:pe.current.x,right:pe.current.x,bottom:pe.current.y,width:0,height:0})}:k,popperRef:ae,open:!!k&&W,id:z,transition:!0},me,de),({placement:e,TransitionProps:t})=>React.createElement(x,_extends({timeout:O.transitions.duration.shorter},t,E),React.createElement("div",{className:clsx(n.tooltip,n[`tooltipPlacement${capitalize(e.split("-")[0])}`],F.current&&n.touch,o&&n.tooltipArrow)},w,o?React.createElement("span",{className:n.arrow,ref:D}):null))))});"production"!==process.env.NODE_ENV&&(Tooltip.propTypes={arrow:PropTypes.bool,children:elementAcceptingRef.isRequired,classes:PropTypes.object,className:PropTypes.string,describeChild:PropTypes.bool,disableFocusListener:PropTypes.bool,disableHoverListener:PropTypes.bool,disableInteractive:PropTypes.bool,disableTouchListener:PropTypes.bool,enterDelay:PropTypes.number,enterNextDelay:PropTypes.number,enterTouchDelay:PropTypes.number,followCursor:PropTypes.bool,id:PropTypes.string,leaveDelay:PropTypes.number,leaveTouchDelay:PropTypes.number,onClose:PropTypes.func,onOpen:PropTypes.func,open:PropTypes.bool,placement:PropTypes.oneOf(["bottom-end","bottom-start","bottom","left-end","left-start","left","right-end","right-start","right","top-end","top-start","top"]),PopperComponent:PropTypes.elementType,PopperProps:PropTypes.object,title:PropTypes.node.isRequired,TransitionComponent:PropTypes.elementType,TransitionProps:PropTypes.object});export default withStyles(styles,{name:"MuiTooltip",flip:!1})(Tooltip);