@fluid-topics/ft-tooltip 1.2.49 → 1.2.51

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -21,6 +21,7 @@ export declare class FtTooltip extends FtLitElement implements FtTooltipProperti
21
21
  protected contentAvailableCallback(props: PropertyValues): void;
22
22
  private hideDebounce;
23
23
  show(duration?: number): Promise<void>;
24
+ showTemporaryText(text: string, duration: number): Promise<void>;
24
25
  hide(): void;
25
26
  toggle(): void;
26
27
  private get slottedElement();
@@ -67,6 +67,15 @@ class FtTooltip extends FtLitElement {
67
67
  }, duration);
68
68
  }
69
69
  }
70
+ async showTemporaryText(text, duration) {
71
+ const manualCurrentValue = this.manual;
72
+ this.manual = true;
73
+ const currentText = this.text;
74
+ this.text = text;
75
+ await this.show(duration);
76
+ this.text = currentText;
77
+ this.manual = manualCurrentValue;
78
+ }
70
79
  hide() {
71
80
  this.visible = false;
72
81
  }
@@ -160,7 +160,7 @@ Also for action icons.`,e.colorGray200),contentGlobalSubtle:t.extend("--ft-conte
160
160
  </div>
161
161
  </div>
162
162
  </div>
163
- `}updated(o){o.has("visible")&&this.visible&&this.resetTooltipContent(),super.updated(o)}contentAvailableCallback(o){super.contentAvailableCallback(o),["visible","text"].some(n=>o.has(n))&&this.visible&&this.positionTooltip()}async show(o){this.visible=!0,o!=null&&await this.hideDebounce.run(()=>{this.hide()},o)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var o;return((o=this.slotNodes)!==null&&o!==void 0?o:[]).filter(n=>n.nodeType==Node.ELEMENT_NODE)[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){let o=this.tooltipContent.style;switch(o.transition="none",this.validPosition){case"top":o.top=this.tooltip.clientHeight+"px",o.left="0";break;case"bottom":o.top=-this.tooltip.clientHeight+"px",o.left="0";break;case"left":o.top="0",o.left=this.tooltip.clientWidth+"px";break;case"right":o.top="0",o.left=-this.tooltip.clientWidth+"px";break}}}positionTooltip(){this.resetTooltipContent(),this.tooltip&&this.slottedElement&&(this.tooltip.style.left="",this.tooltip.style.top="",Xo(this.slottedElement,this.tooltip,this.position).then(({x:o,y:n})=>{this.tooltip&&(this.tooltip.style.left=`${o}px`,this.tooltip.style.top=`${n}px`)})),this.revealDebouncer.run(()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")},this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout(()=>window.addEventListener("touchstart",o=>{o.composedPath().includes(this.container)||this.onOut()},{once:!0}),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}onClick(){this.manual||(this.revealDebouncer.cancel(),this.hide())}correctOutOfWindowPixels(o,n){return Math.max(o,Math.min(0,-n))}};C.elementDefinitions={"ft-typography":G};C.styles=Io;L([(0,N.property)()],C.prototype,"text",void 0);L([(0,N.property)({type:Boolean})],C.prototype,"manual",void 0);L([(0,N.property)({type:Boolean})],C.prototype,"inline",void 0);L([(0,N.property)({type:Number})],C.prototype,"delay",void 0);L([(0,N.property)()],C.prototype,"position",void 0);L([(0,N.queryAssignedNodes)()],C.prototype,"slotNodes",void 0);L([(0,N.query)(".ft-tooltip--container")],C.prototype,"container",void 0);L([(0,N.query)(".ft-tooltip")],C.prototype,"tooltip",void 0);L([(0,N.query)(".ft-tooltip--content")],C.prototype,"tooltipContent",void 0);L([(0,N.state)()],C.prototype,"visible",void 0);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onTouch",null);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onHover",null);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onOut",null);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onClick",null);(0,Jo.customElement)("ft-tooltip")(C);})();
163
+ `}updated(o){o.has("visible")&&this.visible&&this.resetTooltipContent(),super.updated(o)}contentAvailableCallback(o){super.contentAvailableCallback(o),["visible","text"].some(n=>o.has(n))&&this.visible&&this.positionTooltip()}async show(o){this.visible=!0,o!=null&&await this.hideDebounce.run(()=>{this.hide()},o)}async showTemporaryText(o,n){let i=this.manual;this.manual=!0;let c=this.text;this.text=o,await this.show(n),this.text=c,this.manual=i}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var o;return((o=this.slotNodes)!==null&&o!==void 0?o:[]).filter(n=>n.nodeType==Node.ELEMENT_NODE)[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){let o=this.tooltipContent.style;switch(o.transition="none",this.validPosition){case"top":o.top=this.tooltip.clientHeight+"px",o.left="0";break;case"bottom":o.top=-this.tooltip.clientHeight+"px",o.left="0";break;case"left":o.top="0",o.left=this.tooltip.clientWidth+"px";break;case"right":o.top="0",o.left=-this.tooltip.clientWidth+"px";break}}}positionTooltip(){this.resetTooltipContent(),this.tooltip&&this.slottedElement&&(this.tooltip.style.left="",this.tooltip.style.top="",Xo(this.slottedElement,this.tooltip,this.position).then(({x:o,y:n})=>{this.tooltip&&(this.tooltip.style.left=`${o}px`,this.tooltip.style.top=`${n}px`)})),this.revealDebouncer.run(()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")},this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout(()=>window.addEventListener("touchstart",o=>{o.composedPath().includes(this.container)||this.onOut()},{once:!0}),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}onClick(){this.manual||(this.revealDebouncer.cancel(),this.hide())}correctOutOfWindowPixels(o,n){return Math.max(o,Math.min(0,-n))}};C.elementDefinitions={"ft-typography":G};C.styles=Io;L([(0,N.property)()],C.prototype,"text",void 0);L([(0,N.property)({type:Boolean})],C.prototype,"manual",void 0);L([(0,N.property)({type:Boolean})],C.prototype,"inline",void 0);L([(0,N.property)({type:Number})],C.prototype,"delay",void 0);L([(0,N.property)()],C.prototype,"position",void 0);L([(0,N.queryAssignedNodes)()],C.prototype,"slotNodes",void 0);L([(0,N.query)(".ft-tooltip--container")],C.prototype,"container",void 0);L([(0,N.query)(".ft-tooltip")],C.prototype,"tooltip",void 0);L([(0,N.query)(".ft-tooltip--content")],C.prototype,"tooltipContent",void 0);L([(0,N.state)()],C.prototype,"visible",void 0);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onTouch",null);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onHover",null);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onOut",null);L([(0,N.eventOptions)({passive:!0})],C.prototype,"onClick",null);(0,Jo.customElement)("ft-tooltip")(C);})();
164
164
  /*! Bundled license information:
165
165
 
166
166
  lit-html/lit-html.js: