@arcgis/core/views/interactive/Tooltip.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/* COPYRIGHT Esri - https://js.arcgis.com/5.0.8/LICENSE.txt */
import{__decorate as t}from"tslib";import{EventedAccessor as e}from"../../core/Evented.js";import{on as o}from"../../core/events.js";import{destroyMaybe as n}from"../../core/maybe.js";import{watch as i,syncAndInitial as s,initial as r,when as l,sync as p}from"../../core/reactiveUtils.js";import{cloneScreenPoint as a,createScreenPoint as c}from"../../core/screenUtils.js";import{property as u,subclass as d}from"../../core/accessorSupport/decorators.js";import{UpdatingHandles as h}from"../../core/support/UpdatingHandles.js";import{setCalciteModeClass as f}from"../../support/modeUtils.js";import{base as m}from"./tooltip/css.js";import{tooltipContentFactory as y}from"./tooltip/content/tooltipContentFactory.js";import{isRTL as g}from"../../widgets/support/widgetUtils.js";const v={base:`${m}`,ltr:`${m}--ltr`,rtl:`${m}--rtl`,debug:`${m}--debug`},_=20,P=16,C="bottom-end";let b=class extends e{constructor(t){super(t),this.info=null,this.options=null,this.position=null,this.inputModePosition=null,this.content=null,this._focused=!1,this.hidden=!1,this.outerContainer=document.createElement("div"),this.debug=!1,this._updatingHandles=new h,this._lastPosition=null,this._rtl=!1,this._prevXY=[0,0]}initialize(){const{outerContainer:t}=this;this.addHandles([i(()=>this.view.overlay?.surface,e=>{t.remove(),e?.appendChild(t),this._rtl=g(e)},s),i(()=>this.info,(e,o)=>{if(null!=this.content&&null!=e&&null!=o&&e.type===o.type)this.content.info=e;else{n(this.content);const o=y(this,e);o?(this.content=o,o.container&&t.appendChild(o.container),this.exitInputMode()):this.content=null}},s),i(()=>({container:this.outerContainer,style:this._outerContainerStyle}),({container:t,style:e})=>{Object.assign(t.style,e)},r),i(()=>({outerContainer:this.outerContainer,placement:this.effectivePlacement,effectiveOffset:this._effectiveOffset,rtl:this._rtl,debug:this.debug}),({outerContainer:t,placement:e,effectiveOffset:o,rtl:n,debug:i})=>{const{classList:s}=t;s.add(v.base),s.toggle(v.rtl,n),s.toggle(v.ltr,!n),s.toggle(v.debug,i),this.outerContainer.style.setProperty("--offset",`${o}px`),f(t),w(t,e)},r),l(()=>"feedback"===this.mode,()=>{this.inputModePosition=null,this._clearOverride("effectivePlacement")},p),o(this.outerContainer,"paste",t=>{this.emit("paste",t)}),o(this.outerContainer,["focusin","focusout"],()=>{this._focused=this.content?.container?.contains(document.activeElement)??!1})])}destroy(){this.info=null,this.content=n(this.content),this.outerContainer.remove(),this._updatingHandles.destroy()}get isInInputMode(){return!!this.inputModePosition}get mode(){return this.content?.mode??"feedback"}get focused(){return this._focused}get visible(){return"none"!==this._outerContainerStyle.display}get contentContainer(){return this.content?.container}get effectivePlacement(){const t=this.options?.placement;return"auto"===t?"bottom-end":t??C}get updating(){return this._updatingHandles.updating}get _screenPoint(){const{inputManager:t}=this.view;return t?.multiTouchActive?null:t?.latestPointerInfo?.location}get _effectiveOffset(){return this.options?.offset??_}get _outerContainerStyle(){const t=this.inputModePosition??this.position??this._screenPoint;if(this._lastPosition=a(t),null!=t&&null!=this.content&&(!this.hidden||this.inputModePosition)){return{display:"block",transform:`translate(${Math.round(t.x)}px, ${Math.round(t.y)}px)`}}return{display:"none",transform:"none"}}clear(){this.info=null}async enterInputMode(t){const e=this.position??this._lastPosition??this._screenPoint,o=this.inputModePosition=a(e),{effectivePlacement:n}=this;this._override("effectivePlacement",n);const i=()=>{o&&(this.inputModePosition=M(this.contentContainer,o,this._effectiveOffset,this.view),Object.assign(this.outerContainer.style,this._outerContainerStyle))};await this._updatingHandles.addPromise(this.content?.enterInputMode(t,i))}async exitInputMode(t){this.inputModePosition=null,await this._updatingHandles.addPromise(this.content?.exitInputMode(t))}onDragStart(t,e){this._prevXY=[t,e]}onDrag(t,e){const o=t-this._prevXY[0],n=e-this._prevXY[1];this._prevXY=[t,e];const{inputModePosition:i}=this;if(i){const{view:s}=this,r=t-s.position[0],l=e-s.position[1];if(r<0||r>s.width||l<0||l>s.height-P)return;this.inputModePosition=c(i.x+o,i.y+n)}}onDragEnd(){this._prevXY=[0,0]}};function M(t,e,o,n){if(!t||!n.container)return e;const i=t.getBoundingClientRect(),{left:s,top:r}=n.container.getBoundingClientRect();let{x:l,y:p}=e;const a=i.left-s-o;a<0&&(l-=a);const u=i.right-s+o-n.width;u>0&&(l-=u);const d=i.top-r-o;d<0&&(p-=d);const h=i.bottom-r+o-n.height;return h>0&&(p-=h),c(l,p)}t([u({nonNullable:!0})],b.prototype,"view",void 0),t([u()],b.prototype,"info",void 0),t([u()],b.prototype,"options",void 0),t([u()],b.prototype,"position",void 0),t([u()],b.prototype,"inputModePosition",void 0),t([u()],b.prototype,"isInInputMode",null),t([u()],b.prototype,"content",void 0),t([u({readOnly:!0})],b.prototype,"mode",null),t([u()],b.prototype,"_focused",void 0),t([u({readOnly:!0})],b.prototype,"focused",null),t([u()],b.prototype,"hidden",void 0),t([u({readOnly:!0})],b.prototype,"outerContainer",void 0),t([u({readOnly:!0})],b.prototype,"contentContainer",null),t([u({readOnly:!0})],b.prototype,"effectivePlacement",null),t([u()],b.prototype,"debug",void 0),t([u()],b.prototype,"updating",null),t([u()],b.prototype,"_lastPosition",void 0),t([u()],b.prototype,"_screenPoint",null),t([u()],b.prototype,"_rtl",void 0),t([u()],b.prototype,"_effectiveOffset",null),t([u()],b.prototype,"_outerContainerStyle",null),b=t([d("esri.views.interactive.Tooltip")],b);const O=["top","bottom","leading","trailing"].flatMap(t=>[j(`${t}-start`),j(t),j(`${t}-end`)]);function j(t){return`${v.base}--${t}`}function w({classList:t},e){O.forEach(e=>t.remove(e)),t.add(j(e))}const x=b;export{x as default};