@fluid-topics/ft-tooltip 1.1.16 → 1.1.18

package/build/ft-tooltip.d.ts

@@ -20,7 +20,7 @@ export declare class FtTooltip extends FtLitElement implements FtTooltipProperti
     protected updated(props: PropertyValues): void;
     protected contentAvailableCallback(props: PropertyValues): void;
     private hideDebounce;
-    show(duration?: number): void;
+    show(duration?: number): Promise<void>;
     hide(): void;
     toggle(): void;
     private get slottedElement();

package/build/ft-tooltip.js

@@ -60,10 +60,12 @@ class FtTooltip extends FtLitElement {
             this.positionTooltip();
         }
     }
-    show(duration) {
+    async show(duration) {
         this.visible = true;
         if (duration != null) {
-            this.hideDebounce.run(() => this.hide(), duration);
+            await this.hideDebounce.run(() => {
+                this.hide();
+            }, duration);
         }
     }
     hide() {

package/build/ft-tooltip.light.js

@@ -168,4 +168,4 @@ const A=Symbol.for(""),H=t=>{if(t?.r===A)return t?._$litStatic$},G=t=>({_$litSta
                     </div>
                 </div>
             </div>
-        `}updated(t){t.has("visible")&&this.visible&&this.resetTooltipContent(),super.updated(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((o=>t.has(o)))&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){var t;this.resetTooltipContent(),this.tooltip&&this.slottedElement&&(this.tooltip.style.left="",this.tooltip.style.top="",Se(this.slottedElement,this.tooltip,{platform:{...Ne,getOffsetParent:t=>Ne.getOffsetParent(t,xe)},middleware:[(t={crossAxis:!0},void 0===t&&(t={}),{name:"shift",options:t,async fn(o){const{x:e,y:r,placement:a}=o,{mainAxis:n=!0,crossAxis:i=!1,limiter:l={fn:t=>{let{x:o,y:e}=t;return{x:o,y:e}}},...c}=$o(t,o),f={x:e,y:r},p=await Go(o,c),s=Fo(Ko(a)),y=ko(s);let g=f[y],h=f[s];if(n){const t="y"===y?"bottom":"right";g=Lo(g+p["y"===y?"top":"left"],g,g-p[t])}if(i){const t="y"===s?"bottom":"right";h=Lo(h+p["y"===s?"top":"left"],h,h-p[t])}const d=l.fn({...o,[y]:g,[s]:h});return{...d,data:{x:d.x-e,y:d.y-r}}}}),Mo({allowedPlacements:[this.position]})]}).then((({x:t,y:o})=>{this.tooltip&&(this.tooltip.style.left=`${t}px`,this.tooltip.style.top=`${o}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",(t=>{t.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(t,o){return Math.max(t,Math.min(0,-o))}}ve.elementDefinitions={"ft-typography":No},ve.styles=xo,we([r.property()],ve.prototype,"text",void 0),we([r.property({type:Boolean})],ve.prototype,"manual",void 0),we([r.property({type:Boolean})],ve.prototype,"inline",void 0),we([r.property({type:Number})],ve.prototype,"delay",void 0),we([r.property()],ve.prototype,"position",void 0),we([r.queryAssignedNodes()],ve.prototype,"slotNodes",void 0),we([r.query(".ft-tooltip--container")],ve.prototype,"container",void 0),we([r.query(".ft-tooltip")],ve.prototype,"tooltip",void 0),we([r.query(".ft-tooltip--content")],ve.prototype,"tooltipContent",void 0),we([r.state()],ve.prototype,"visible",void 0),we([r.eventOptions({passive:!0})],ve.prototype,"onTouch",null),we([r.eventOptions({passive:!0})],ve.prototype,"onHover",null),we([r.eventOptions({passive:!0})],ve.prototype,"onOut",null),we([r.eventOptions({passive:!0})],ve.prototype,"onClick",null),o.customElement("ft-tooltip")(ve),t.FtTooltip=ve,t.FtTooltipCssVariables=So,t.styles=xo}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators);
+        `}updated(t){t.has("visible")&&this.visible&&this.resetTooltipContent(),super.updated(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((o=>t.has(o)))&&this.visible&&this.positionTooltip()}async show(t){this.visible=!0,null!=t&&await this.hideDebounce.run((()=>{this.hide()}),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){var t;this.resetTooltipContent(),this.tooltip&&this.slottedElement&&(this.tooltip.style.left="",this.tooltip.style.top="",Se(this.slottedElement,this.tooltip,{platform:{...Ne,getOffsetParent:t=>Ne.getOffsetParent(t,xe)},middleware:[(t={crossAxis:!0},void 0===t&&(t={}),{name:"shift",options:t,async fn(o){const{x:e,y:r,placement:a}=o,{mainAxis:n=!0,crossAxis:i=!1,limiter:l={fn:t=>{let{x:o,y:e}=t;return{x:o,y:e}}},...c}=$o(t,o),f={x:e,y:r},p=await Go(o,c),s=Fo(Ko(a)),y=ko(s);let g=f[y],h=f[s];if(n){const t="y"===y?"bottom":"right";g=Lo(g+p["y"===y?"top":"left"],g,g-p[t])}if(i){const t="y"===s?"bottom":"right";h=Lo(h+p["y"===s?"top":"left"],h,h-p[t])}const d=l.fn({...o,[y]:g,[s]:h});return{...d,data:{x:d.x-e,y:d.y-r}}}}),Mo({allowedPlacements:[this.position]})]}).then((({x:t,y:o})=>{this.tooltip&&(this.tooltip.style.left=`${t}px`,this.tooltip.style.top=`${o}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",(t=>{t.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(t,o){return Math.max(t,Math.min(0,-o))}}ve.elementDefinitions={"ft-typography":No},ve.styles=xo,we([r.property()],ve.prototype,"text",void 0),we([r.property({type:Boolean})],ve.prototype,"manual",void 0),we([r.property({type:Boolean})],ve.prototype,"inline",void 0),we([r.property({type:Number})],ve.prototype,"delay",void 0),we([r.property()],ve.prototype,"position",void 0),we([r.queryAssignedNodes()],ve.prototype,"slotNodes",void 0),we([r.query(".ft-tooltip--container")],ve.prototype,"container",void 0),we([r.query(".ft-tooltip")],ve.prototype,"tooltip",void 0),we([r.query(".ft-tooltip--content")],ve.prototype,"tooltipContent",void 0),we([r.state()],ve.prototype,"visible",void 0),we([r.eventOptions({passive:!0})],ve.prototype,"onTouch",null),we([r.eventOptions({passive:!0})],ve.prototype,"onHover",null),we([r.eventOptions({passive:!0})],ve.prototype,"onOut",null),we([r.eventOptions({passive:!0})],ve.prototype,"onClick",null),o.customElement("ft-tooltip")(ve),t.FtTooltip=ve,t.FtTooltipCssVariables=So,t.styles=xo}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators);

package/build/ft-tooltip.min.js

@@ -288,4 +288,4 @@ const To=Symbol.for(""),_o=t=>{if(t?.r===To)return t?._$litStatic$},jo=t=>({_$li
                     </div>
                 </div>
             </div>
-        `}updated(t){t.has("visible")&&this.visible&&this.resetTooltipContent(),super.updated(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((o=>t.has(o)))&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){var t;this.resetTooltipContent(),this.tooltip&&this.slottedElement&&(this.tooltip.style.left="",this.tooltip.style.top="",Oi(this.slottedElement,this.tooltip,{platform:{...mi,getOffsetParent:t=>mi.getOffsetParent(t,Ni)},middleware:[(t={crossAxis:!0},void 0===t&&(t={}),{name:"shift",options:t,async fn(o){const{x:e,y:r,placement:i}=o,{mainAxis:n=!0,crossAxis:a=!1,limiter:s={fn:t=>{let{x:o,y:e}=t;return{x:o,y:e}}},...c}=Wr(t,o),l={x:e,y:r},f=await Dr(o,c),p=Zr(Lr(i)),h=kr(p);let d=l[h],y=l[p];if(n){const t="y"===h?"bottom":"right";d=Ir(d+f["y"===h?"top":"left"],d,d-f[t])}if(a){const t="y"===p?"bottom":"right";y=Ir(y+f["y"===p?"top":"left"],y,y-f[t])}const g=s.fn({...o,[h]:d,[p]:y});return{...g,data:{x:g.x-e,y:g.y-r}}}}),Pr({allowedPlacements:[this.position]})]}).then((({x:t,y:o})=>{this.tooltip&&(this.tooltip.style.left=`${t}px`,this.tooltip.style.top=`${o}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",(t=>{t.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(t,o){return Math.max(t,Math.min(0,-o))}}vi.elementDefinitions={"ft-typography":mr},vi.styles=Nr,xi([C()],vi.prototype,"text",void 0),xi([C({type:Boolean})],vi.prototype,"manual",void 0),xi([C({type:Boolean})],vi.prototype,"inline",void 0),xi([C({type:Number})],vi.prototype,"delay",void 0),xi([C()],vi.prototype,"position",void 0),xi([function(t){return(o,e)=>{const{slot:r}=t??{},i="slot"+(r?`[name=${r}]`:":not([name])");return E(0,0,{get(){const o=this.renderRoot?.querySelector(i);return o?.assignedNodes(t)??[]}})}}()],vi.prototype,"slotNodes",void 0),xi([U(".ft-tooltip--container")],vi.prototype,"container",void 0),xi([U(".ft-tooltip")],vi.prototype,"tooltip",void 0),xi([U(".ft-tooltip--content")],vi.prototype,"tooltipContent",void 0),xi([function(t){return C({...t,state:!0,attribute:!1})}()],vi.prototype,"visible",void 0),xi([R({passive:!0})],vi.prototype,"onTouch",null),xi([R({passive:!0})],vi.prototype,"onHover",null),xi([R({passive:!0})],vi.prototype,"onOut",null),xi([R({passive:!0})],vi.prototype,"onClick",null),W("ft-tooltip")(vi),t.FtTooltip=vi,t.FtTooltipCssVariables=Or,t.styles=Nr}({});
+        `}updated(t){t.has("visible")&&this.visible&&this.resetTooltipContent(),super.updated(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((o=>t.has(o)))&&this.visible&&this.positionTooltip()}async show(t){this.visible=!0,null!=t&&await this.hideDebounce.run((()=>{this.hide()}),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){var t;this.resetTooltipContent(),this.tooltip&&this.slottedElement&&(this.tooltip.style.left="",this.tooltip.style.top="",Oi(this.slottedElement,this.tooltip,{platform:{...mi,getOffsetParent:t=>mi.getOffsetParent(t,Ni)},middleware:[(t={crossAxis:!0},void 0===t&&(t={}),{name:"shift",options:t,async fn(o){const{x:e,y:r,placement:i}=o,{mainAxis:n=!0,crossAxis:a=!1,limiter:s={fn:t=>{let{x:o,y:e}=t;return{x:o,y:e}}},...c}=Wr(t,o),l={x:e,y:r},f=await Dr(o,c),p=Zr(Lr(i)),h=kr(p);let d=l[h],y=l[p];if(n){const t="y"===h?"bottom":"right";d=Ir(d+f["y"===h?"top":"left"],d,d-f[t])}if(a){const t="y"===p?"bottom":"right";y=Ir(y+f["y"===p?"top":"left"],y,y-f[t])}const g=s.fn({...o,[h]:d,[p]:y});return{...g,data:{x:g.x-e,y:g.y-r}}}}),Pr({allowedPlacements:[this.position]})]}).then((({x:t,y:o})=>{this.tooltip&&(this.tooltip.style.left=`${t}px`,this.tooltip.style.top=`${o}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",(t=>{t.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(t,o){return Math.max(t,Math.min(0,-o))}}vi.elementDefinitions={"ft-typography":mr},vi.styles=Nr,xi([C()],vi.prototype,"text",void 0),xi([C({type:Boolean})],vi.prototype,"manual",void 0),xi([C({type:Boolean})],vi.prototype,"inline",void 0),xi([C({type:Number})],vi.prototype,"delay",void 0),xi([C()],vi.prototype,"position",void 0),xi([function(t){return(o,e)=>{const{slot:r}=t??{},i="slot"+(r?`[name=${r}]`:":not([name])");return E(0,0,{get(){const o=this.renderRoot?.querySelector(i);return o?.assignedNodes(t)??[]}})}}()],vi.prototype,"slotNodes",void 0),xi([U(".ft-tooltip--container")],vi.prototype,"container",void 0),xi([U(".ft-tooltip")],vi.prototype,"tooltip",void 0),xi([U(".ft-tooltip--content")],vi.prototype,"tooltipContent",void 0),xi([function(t){return C({...t,state:!0,attribute:!1})}()],vi.prototype,"visible",void 0),xi([R({passive:!0})],vi.prototype,"onTouch",null),xi([R({passive:!0})],vi.prototype,"onHover",null),xi([R({passive:!0})],vi.prototype,"onOut",null),xi([R({passive:!0})],vi.prototype,"onClick",null),W("ft-tooltip")(vi),t.FtTooltip=vi,t.FtTooltipCssVariables=Or,t.styles=Nr}({});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-tooltip",
-  "version": "1.1.16",
+  "version": "1.1.18",
   "description": "A simple tooltip component",
   "keywords": [
     "Lit"
@@ -20,10 +20,10 @@
   },
   "dependencies": {
     "@floating-ui/dom": "1.5.3",
-    "@fluid-topics/ft-typography": "1.1.16",
-    "@fluid-topics/ft-wc-utils": "1.1.16",
+    "@fluid-topics/ft-typography": "1.1.18",
+    "@fluid-topics/ft-wc-utils": "1.1.18",
     "composed-offset-position": "^0.0.4",
     "lit": "3.1.0"
   },
-  "gitHead": "28b18ce8d88cc14097865aad4a8b31406b351434"
+  "gitHead": "30d914e4439747c7af8baebd0b9ebbc344de2ecf"
 }