@fluid-topics/ft-dialog 1.0.1 → 1.0.4
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.
- package/build/ft-dialog.js +1 -0
- package/build/ft-dialog.light.js +3 -3
- package/build/ft-dialog.min.js +3 -3
- package/package.json +6 -6
package/build/ft-dialog.js
CHANGED
package/build/ft-dialog.light.js
CHANGED
|
@@ -272,7 +272,7 @@ const H=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===H)return null==t?void 0:t
|
|
|
272
272
|
<div class="ft-ripple--background"></div>
|
|
273
273
|
<div class="ft-ripple--effect"></div>
|
|
274
274
|
</div>
|
|
275
|
-
`}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var i,e;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(i=this.target)||void 0===i||i.removeAttribute("data-is-ft-ripple-target")):null===(e=this.target)||void 0===e||e.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>{var t;const
|
|
275
|
+
`}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var i,e;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(i=this.target)||void 0===i||i.removeAttribute("data-is-ft-ripple-target")):null===(e=this.target)||void 0===e||e.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>this.defaultSetup()))}defaultSetup(){var t,i;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentElement;e&&this.setupFor(null!==(i=this.target)&&void 0!==i?i:e),this.setRippleSize()}setupFor(t){if(this.setupDebouncer.cancel(),this.target===t)return;this.onDisconnect&&this.onDisconnect(),this.target=t,t.setAttribute("data-is-ft-ripple-target","true");const i=(...t)=>i=>{t.forEach((t=>window.addEventListener(t,this.endPress,{once:!0}))),this.startPress(i)},e=i("mouseup","contextmenu"),o=i("touchend","touchcancel"),n=t=>{["Enter"," "].includes(t.key)&&i("keyup")(t)};t.addEventListener("mouseover",this.startHover),t.addEventListener("mousemove",this.moveRipple),t.addEventListener("mouseleave",this.endHover),t.addEventListener("mousedown",e),t.addEventListener("touchstart",o),t.addEventListener("touchmove",this.moveRipple),t.addEventListener("keydown",n),t.addEventListener("focus",this.startFocus),t.addEventListener("blur",this.endFocus),t.addEventListener("focusin",this.startFocus),t.addEventListener("focusout",this.endFocus),this.onDisconnect=()=>{t.removeAttribute("data-is-ft-ripple-target"),t.removeEventListener("mouseover",this.startHover),t.removeEventListener("mousemove",this.moveRipple),t.removeEventListener("mouseleave",this.endHover),t.removeEventListener("mousedown",e),t.removeEventListener("touchstart",o),t.removeEventListener("touchmove",this.moveRipple),t.removeEventListener("keydown",n),t.removeEventListener("focus",this.startFocus),t.removeEventListener("blur",this.endFocus),t.removeEventListener("focusin",this.startFocus),t.removeEventListener("focusout",this.endFocus),this.onDisconnect=void 0,this.target=void 0}}getCoordinates(t){const i=t,e=t;let o,n;return null!=i.x?({x:o,y:n}=i):null!=e.touches&&(o=e.touches[0].clientX,n=e.touches[0].clientY),{x:o,y:n}}isIgnored(t){if(this.disabled)return!0;if(null!=t)for(let i of t.composedPath()){if(i===this.target)break;if("hasAttribute"in i&&i.hasAttribute("data-is-ft-ripple-target"))return!0}return!1}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.resizeObserver.disconnect(),this.endRipple()}}Ii.elementDefinitions={},Ii.styles=Oi,Ci([o.property({type:Boolean})],Ii.prototype,"primary",void 0),Ci([o.property({type:Boolean})],Ii.prototype,"secondary",void 0),Ci([o.property({type:Boolean})],Ii.prototype,"unbounded",void 0),Ci([o.property({type:Boolean})],Ii.prototype,"activated",void 0),Ci([o.property({type:Boolean})],Ii.prototype,"selected",void 0),Ci([o.property({type:Boolean})],Ii.prototype,"disabled",void 0),Ci([o.state()],Ii.prototype,"hovered",void 0),Ci([o.state()],Ii.prototype,"focused",void 0),Ci([o.state()],Ii.prototype,"pressed",void 0),Ci([o.state()],Ii.prototype,"rippling",void 0),Ci([o.state()],Ii.prototype,"rippleSize",void 0),Ci([o.state()],Ii.prototype,"originX",void 0),Ci([o.state()],Ii.prototype,"originY",void 0),Ci([o.query(".ft-ripple")],Ii.prototype,"ripple",void 0),Ci([o.query(".ft-ripple--effect")],Ii.prototype,"rippleEffect",void 0),i.customElement("ft-ripple")(Ii);const ji=i.FtCssVariableFactory.create("--ft-tooltip-distance","SIZE","4px"),Ni=i.FtCssVariableFactory.create("--ft-tooltip-color","COLOR","#FFFFFF"),Bi=i.FtCssVariableFactory.create("--ft-tooltip-background-color","COLOR","#666666"),Zi=i.FtCssVariableFactory.create("--ft-tooltip-z-index","NUMBER","1"),Ti=i.FtCssVariableFactory.external(i.designSystemVariables.borderRadiusS,"Design system"),Ai=i.FtCssVariableFactory.create("--ft-tooltip-max-width","SIZE","150px"),Fi=e.css`
|
|
276
276
|
.ft-tooltip--container {
|
|
277
277
|
display: block;
|
|
278
278
|
position: relative;
|
|
@@ -322,7 +322,7 @@ const H=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===H)return null==t?void 0:t
|
|
|
322
322
|
</div>
|
|
323
323
|
</div>
|
|
324
324
|
</div>
|
|
325
|
-
`}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){["visible","text"].some((i=>t.has(i)))&&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(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const i=t.getBoundingClientRect(),e=(i.height-this.tooltip.clientHeight)/2,o=(i.width-this.tooltip.clientWidth)/2;let n=0,s=0;switch(this.validPosition){case"top":s=-this.tooltip.clientHeight,n=o;break;case"bottom":s=i.height,n=o;break;case"left":s=e,n=-this.tooltip.clientWidth;break;case"right":s=e,n=i.width}i.left+n+this.tooltip.clientWidth>window.innerWidth&&(n=window.innerWidth-this.tooltip.clientWidth-i.left),i.left+n<0&&(n=0);const r=this.tooltip.style;r.left=n+"px",r.top=s+"px",r.maxWidth=`max(${i.width}px, ${Ai})`}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())}}Ri.elementDefinitions={"ft-typography":ci},Ri.styles=Fi,_i([o.property()],Ri.prototype,"text",void 0),_i([o.property({type:Boolean})],Ri.prototype,"manual",void 0),_i([o.property({type:Boolean})],Ri.prototype,"inline",void 0),_i([o.property({type:Number})],Ri.prototype,"delay",void 0),_i([o.property()],Ri.prototype,"position",void 0),_i([o.queryAssignedNodes("",!0)],Ri.prototype,"slotNodes",void 0),_i([o.query(".ft-tooltip--container")],Ri.prototype,"container",void 0),_i([o.query("slot")],Ri.prototype,"target",void 0),_i([o.query(".ft-tooltip")],Ri.prototype,"tooltip",void 0),_i([o.query(".ft-tooltip--content")],Ri.prototype,"tooltipContent",void 0),_i([o.state()],Ri.prototype,"visible",void 0),i.customElement("ft-tooltip")(Ri);const Ui={color:i.FtCssVariableFactory.extend("--ft-loader-color",i.designSystemVariables.colorPrimary),size:i.FtCssVariableFactory.create("--ft-loader-size","SIZE","80px")},Mi=e.css`
|
|
325
|
+
`}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((i=>t.has(i)))&&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(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const i=t.getBoundingClientRect(),e=(i.height-this.tooltip.clientHeight)/2,o=(i.width-this.tooltip.clientWidth)/2;let n=0,s=0;switch(this.validPosition){case"top":s=-this.tooltip.clientHeight,n=o;break;case"bottom":s=i.height,n=o;break;case"left":s=e,n=-this.tooltip.clientWidth;break;case"right":s=e,n=i.width}i.left+n+this.tooltip.clientWidth>window.innerWidth&&(n=window.innerWidth-this.tooltip.clientWidth-i.left),i.left+n<0&&(n=0);const r=this.tooltip.style;r.left=n+"px",r.top=s+"px",r.maxWidth=`max(${i.width}px, ${Ai})`}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())}}Ri.elementDefinitions={"ft-typography":ci},Ri.styles=Fi,_i([o.property()],Ri.prototype,"text",void 0),_i([o.property({type:Boolean})],Ri.prototype,"manual",void 0),_i([o.property({type:Boolean})],Ri.prototype,"inline",void 0),_i([o.property({type:Number})],Ri.prototype,"delay",void 0),_i([o.property()],Ri.prototype,"position",void 0),_i([o.queryAssignedNodes("",!0)],Ri.prototype,"slotNodes",void 0),_i([o.query(".ft-tooltip--container")],Ri.prototype,"container",void 0),_i([o.query("slot")],Ri.prototype,"target",void 0),_i([o.query(".ft-tooltip")],Ri.prototype,"tooltip",void 0),_i([o.query(".ft-tooltip--content")],Ri.prototype,"tooltipContent",void 0),_i([o.state()],Ri.prototype,"visible",void 0),i.customElement("ft-tooltip")(Ri);const Ui={color:i.FtCssVariableFactory.extend("--ft-loader-color",i.designSystemVariables.colorPrimary),size:i.FtCssVariableFactory.create("--ft-loader-size","SIZE","80px")},Mi=e.css`
|
|
326
326
|
:host {
|
|
327
327
|
line-height: 0;
|
|
328
328
|
}
|
|
@@ -683,4 +683,4 @@ const H=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===H)return null==t?void 0:t
|
|
|
683
683
|
></slot>
|
|
684
684
|
</div>
|
|
685
685
|
</div>
|
|
686
|
-
`:null}updated(t){t.has("opened")&&(this.dispatchEvent(new CustomEvent("opened-changed",{detail:{opened:this.opened}})),this.opened?setTimeout((()=>{document.addEventListener("keydown",this.watchEscapeKey)}),0):document.removeEventListener("keydown",this.watchEscapeKey))}close(){this.beforeClose()&&(this.opened=!1)}open(){this.opened=!0}onClickOutside(){this.closeOnClickOutside&&this.close()}}ee.elementDefinitions={"ft-typography":ci,"ft-icon":bi,"ft-button":Ji},ee.styles=te,ie([o.property({type:Boolean,hasChanged:(t,i)=>!1===i&&!0===t||!0===i&&!1===t})],ee.prototype,"opened",void 0),ie([o.property({type:Boolean})],ee.prototype,"closeOnEsc",void 0),ie([o.property({type:Boolean})],ee.prototype,"closeOnClickOutside",void 0),ie([o.property({type:Boolean})],ee.prototype,"closable",void 0),ie([o.property({type:()=>Boolean})],ee.prototype,"beforeClose",void 0),ie([o.property()],ee.prototype,"heading",void 0),ie([o.property()],ee.prototype,"icon",void 0),ie([o.property()],ee.prototype,"iconVariant",void 0),ie([o.queryAssignedElements({slot:"buttons"})],ee.prototype,"buttons",void 0),i.customElement("ft-dialog")(ee),t.FtDialog=ee,t.FtDialogCssVariables=Qi,t.styles=te}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators,ftGlobals.litUnsafeHTML,ftGlobals.litClassMap);
|
|
686
|
+
`:null}updated(t){super.updated(t),t.has("opened")&&(this.dispatchEvent(new CustomEvent("opened-changed",{detail:{opened:this.opened}})),this.opened?setTimeout((()=>{document.addEventListener("keydown",this.watchEscapeKey)}),0):document.removeEventListener("keydown",this.watchEscapeKey))}close(){this.beforeClose()&&(this.opened=!1)}open(){this.opened=!0}onClickOutside(){this.closeOnClickOutside&&this.close()}}ee.elementDefinitions={"ft-typography":ci,"ft-icon":bi,"ft-button":Ji},ee.styles=te,ie([o.property({type:Boolean,hasChanged:(t,i)=>!1===i&&!0===t||!0===i&&!1===t})],ee.prototype,"opened",void 0),ie([o.property({type:Boolean})],ee.prototype,"closeOnEsc",void 0),ie([o.property({type:Boolean})],ee.prototype,"closeOnClickOutside",void 0),ie([o.property({type:Boolean})],ee.prototype,"closable",void 0),ie([o.property({type:()=>Boolean})],ee.prototype,"beforeClose",void 0),ie([o.property()],ee.prototype,"heading",void 0),ie([o.property()],ee.prototype,"icon",void 0),ie([o.property()],ee.prototype,"iconVariant",void 0),ie([o.queryAssignedElements({slot:"buttons"})],ee.prototype,"buttons",void 0),i.customElement("ft-dialog")(ee),t.FtDialog=ee,t.FtDialogCssVariables=Qi,t.styles=te}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators,ftGlobals.litUnsafeHTML,ftGlobals.litClassMap);
|
package/build/ft-dialog.min.js
CHANGED
|
@@ -383,7 +383,7 @@ const yi=ni(class extends si{constructor(t){var e;if(super(t),t.type!==ii||"clas
|
|
|
383
383
|
<div class="ft-ripple--background"></div>
|
|
384
384
|
<div class="ft-ripple--effect"></div>
|
|
385
385
|
</div>
|
|
386
|
-
`}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var e,i;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(e=this.target)||void 0===e||e.removeAttribute("data-is-ft-ripple-target")):null===(i=this.target)||void 0===i||i.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>{var t;const
|
|
386
|
+
`}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var e,i;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(e=this.target)||void 0===e||e.removeAttribute("data-is-ft-ripple-target")):null===(i=this.target)||void 0===i||i.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>this.defaultSetup()))}defaultSetup(){var t,e;const i=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentElement;i&&this.setupFor(null!==(e=this.target)&&void 0!==e?e:i),this.setRippleSize()}setupFor(t){if(this.setupDebouncer.cancel(),this.target===t)return;this.onDisconnect&&this.onDisconnect(),this.target=t,t.setAttribute("data-is-ft-ripple-target","true");const e=(...t)=>e=>{t.forEach((t=>window.addEventListener(t,this.endPress,{once:!0}))),this.startPress(e)},i=e("mouseup","contextmenu"),o=e("touchend","touchcancel"),n=t=>{["Enter"," "].includes(t.key)&&e("keyup")(t)};t.addEventListener("mouseover",this.startHover),t.addEventListener("mousemove",this.moveRipple),t.addEventListener("mouseleave",this.endHover),t.addEventListener("mousedown",i),t.addEventListener("touchstart",o),t.addEventListener("touchmove",this.moveRipple),t.addEventListener("keydown",n),t.addEventListener("focus",this.startFocus),t.addEventListener("blur",this.endFocus),t.addEventListener("focusin",this.startFocus),t.addEventListener("focusout",this.endFocus),this.onDisconnect=()=>{t.removeAttribute("data-is-ft-ripple-target"),t.removeEventListener("mouseover",this.startHover),t.removeEventListener("mousemove",this.moveRipple),t.removeEventListener("mouseleave",this.endHover),t.removeEventListener("mousedown",i),t.removeEventListener("touchstart",o),t.removeEventListener("touchmove",this.moveRipple),t.removeEventListener("keydown",n),t.removeEventListener("focus",this.startFocus),t.removeEventListener("blur",this.endFocus),t.removeEventListener("focusin",this.startFocus),t.removeEventListener("focusout",this.endFocus),this.onDisconnect=void 0,this.target=void 0}}getCoordinates(t){const e=t,i=t;let o,n;return null!=e.x?({x:o,y:n}=e):null!=i.touches&&(o=i.touches[0].clientX,n=i.touches[0].clientY),{x:o,y:n}}isIgnored(t){if(this.disabled)return!0;if(null!=t)for(let e of t.composedPath()){if(e===this.target)break;if("hasAttribute"in e&&e.hasAttribute("data-is-ft-ripple-target"))return!0}return!1}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.resizeObserver.disconnect(),this.endRipple()}}Ci.elementDefinitions={},Ci.styles=Si,ki([o({type:Boolean})],Ci.prototype,"primary",void 0),ki([o({type:Boolean})],Ci.prototype,"secondary",void 0),ki([o({type:Boolean})],Ci.prototype,"unbounded",void 0),ki([o({type:Boolean})],Ci.prototype,"activated",void 0),ki([o({type:Boolean})],Ci.prototype,"selected",void 0),ki([o({type:Boolean})],Ci.prototype,"disabled",void 0),ki([n()],Ci.prototype,"hovered",void 0),ki([n()],Ci.prototype,"focused",void 0),ki([n()],Ci.prototype,"pressed",void 0),ki([n()],Ci.prototype,"rippling",void 0),ki([n()],Ci.prototype,"rippleSize",void 0),ki([n()],Ci.prototype,"originX",void 0),ki([n()],Ci.prototype,"originY",void 0),ki([r(".ft-ripple")],Ci.prototype,"ripple",void 0),ki([r(".ft-ripple--effect")],Ci.prototype,"rippleEffect",void 0),c("ft-ripple")(Ci);const Ei=gt.create("--ft-tooltip-distance","SIZE","4px"),Ni=gt.create("--ft-tooltip-color","COLOR","#FFFFFF"),Ri=gt.create("--ft-tooltip-background-color","COLOR","#666666"),Mi=gt.create("--ft-tooltip-z-index","NUMBER","1"),Ui=gt.external(xt.borderRadiusS,"Design system"),ji=gt.create("--ft-tooltip-max-width","SIZE","150px"),zi=b`
|
|
387
387
|
.ft-tooltip--container {
|
|
388
388
|
display: block;
|
|
389
389
|
position: relative;
|
|
@@ -433,7 +433,7 @@ const yi=ni(class extends si{constructor(t){var e;if(super(t),t.type!==ii||"clas
|
|
|
433
433
|
</div>
|
|
434
434
|
</div>
|
|
435
435
|
</div>
|
|
436
|
-
`}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){["visible","text"].some((e=>t.has(e)))&&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(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const e=t.getBoundingClientRect(),i=(e.height-this.tooltip.clientHeight)/2,o=(e.width-this.tooltip.clientWidth)/2;let n=0,s=0;switch(this.validPosition){case"top":s=-this.tooltip.clientHeight,n=o;break;case"bottom":s=e.height,n=o;break;case"left":s=i,n=-this.tooltip.clientWidth;break;case"right":s=i,n=e.width}e.left+n+this.tooltip.clientWidth>window.innerWidth&&(n=window.innerWidth-this.tooltip.clientWidth-e.left),e.left+n<0&&(n=0);const r=this.tooltip.style;r.left=n+"px",r.top=s+"px",r.maxWidth=`max(${e.width}px, ${ji})`}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())}}Bi.elementDefinitions={"ft-typography":ei},Bi.styles=zi,Fi([o()],Bi.prototype,"text",void 0),Fi([o({type:Boolean})],Bi.prototype,"manual",void 0),Fi([o({type:Boolean})],Bi.prototype,"inline",void 0),Fi([o({type:Number})],Bi.prototype,"delay",void 0),Fi([o()],Bi.prototype,"position",void 0),Fi([function(t,e,i){let o,n=t;return"object"==typeof t?(n=t.slot,o=t):o={flatten:e},i?h({slot:n,flatten:e,selector:i}):s({descriptor:t=>({get(){var t,e;const i="slot"+(n?`[name=${n}]`:":not([name])"),s=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(i);return null!==(e=null==s?void 0:s.assignedNodes(o))&&void 0!==e?e:[]},enumerable:!0,configurable:!0})})}("",!0)],Bi.prototype,"slotNodes",void 0),Fi([r(".ft-tooltip--container")],Bi.prototype,"container",void 0),Fi([r("slot")],Bi.prototype,"target",void 0),Fi([r(".ft-tooltip")],Bi.prototype,"tooltip",void 0),Fi([r(".ft-tooltip--content")],Bi.prototype,"tooltipContent",void 0),Fi([n()],Bi.prototype,"visible",void 0),c("ft-tooltip")(Bi);const Ai={color:gt.extend("--ft-loader-color",xt.colorPrimary),size:gt.create("--ft-loader-size","SIZE","80px")},Ti=b`
|
|
436
|
+
`}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((e=>t.has(e)))&&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(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const e=t.getBoundingClientRect(),i=(e.height-this.tooltip.clientHeight)/2,o=(e.width-this.tooltip.clientWidth)/2;let n=0,s=0;switch(this.validPosition){case"top":s=-this.tooltip.clientHeight,n=o;break;case"bottom":s=e.height,n=o;break;case"left":s=i,n=-this.tooltip.clientWidth;break;case"right":s=i,n=e.width}e.left+n+this.tooltip.clientWidth>window.innerWidth&&(n=window.innerWidth-this.tooltip.clientWidth-e.left),e.left+n<0&&(n=0);const r=this.tooltip.style;r.left=n+"px",r.top=s+"px",r.maxWidth=`max(${e.width}px, ${ji})`}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())}}Bi.elementDefinitions={"ft-typography":ei},Bi.styles=zi,Fi([o()],Bi.prototype,"text",void 0),Fi([o({type:Boolean})],Bi.prototype,"manual",void 0),Fi([o({type:Boolean})],Bi.prototype,"inline",void 0),Fi([o({type:Number})],Bi.prototype,"delay",void 0),Fi([o()],Bi.prototype,"position",void 0),Fi([function(t,e,i){let o,n=t;return"object"==typeof t?(n=t.slot,o=t):o={flatten:e},i?h({slot:n,flatten:e,selector:i}):s({descriptor:t=>({get(){var t,e;const i="slot"+(n?`[name=${n}]`:":not([name])"),s=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(i);return null!==(e=null==s?void 0:s.assignedNodes(o))&&void 0!==e?e:[]},enumerable:!0,configurable:!0})})}("",!0)],Bi.prototype,"slotNodes",void 0),Fi([r(".ft-tooltip--container")],Bi.prototype,"container",void 0),Fi([r("slot")],Bi.prototype,"target",void 0),Fi([r(".ft-tooltip")],Bi.prototype,"tooltip",void 0),Fi([r(".ft-tooltip--content")],Bi.prototype,"tooltipContent",void 0),Fi([n()],Bi.prototype,"visible",void 0),c("ft-tooltip")(Bi);const Ai={color:gt.extend("--ft-loader-color",xt.colorPrimary),size:gt.create("--ft-loader-size","SIZE","80px")},Ti=b`
|
|
437
437
|
:host {
|
|
438
438
|
line-height: 0;
|
|
439
439
|
}
|
|
@@ -794,4 +794,4 @@ const yi=ni(class extends si{constructor(t){var e;if(super(t),t.type!==ii||"clas
|
|
|
794
794
|
></slot>
|
|
795
795
|
</div>
|
|
796
796
|
</div>
|
|
797
|
-
`:null}updated(t){t.has("opened")&&(this.dispatchEvent(new CustomEvent("opened-changed",{detail:{opened:this.opened}})),this.opened?setTimeout((()=>{document.addEventListener("keydown",this.watchEscapeKey)}),0):document.removeEventListener("keydown",this.watchEscapeKey))}close(){this.beforeClose()&&(this.opened=!1)}open(){this.opened=!0}onClickOutside(){this.closeOnClickOutside&&this.close()}}Qi.elementDefinitions={"ft-typography":ei,"ft-icon":ui,"ft-button":qi},Qi.styles=Yi,Gi([o({type:Boolean,hasChanged:(t,e)=>!1===e&&!0===t||!0===e&&!1===t})],Qi.prototype,"opened",void 0),Gi([o({type:Boolean})],Qi.prototype,"closeOnEsc",void 0),Gi([o({type:Boolean})],Qi.prototype,"closeOnClickOutside",void 0),Gi([o({type:Boolean})],Qi.prototype,"closable",void 0),Gi([o({type:()=>Boolean})],Qi.prototype,"beforeClose",void 0),Gi([o()],Qi.prototype,"heading",void 0),Gi([o()],Qi.prototype,"icon",void 0),Gi([o()],Qi.prototype,"iconVariant",void 0),Gi([h({slot:"buttons"})],Qi.prototype,"buttons",void 0),c("ft-dialog")(Qi),t.FtDialog=Qi,t.FtDialogCssVariables=Xi,t.styles=Yi}({});
|
|
797
|
+
`:null}updated(t){super.updated(t),t.has("opened")&&(this.dispatchEvent(new CustomEvent("opened-changed",{detail:{opened:this.opened}})),this.opened?setTimeout((()=>{document.addEventListener("keydown",this.watchEscapeKey)}),0):document.removeEventListener("keydown",this.watchEscapeKey))}close(){this.beforeClose()&&(this.opened=!1)}open(){this.opened=!0}onClickOutside(){this.closeOnClickOutside&&this.close()}}Qi.elementDefinitions={"ft-typography":ei,"ft-icon":ui,"ft-button":qi},Qi.styles=Yi,Gi([o({type:Boolean,hasChanged:(t,e)=>!1===e&&!0===t||!0===e&&!1===t})],Qi.prototype,"opened",void 0),Gi([o({type:Boolean})],Qi.prototype,"closeOnEsc",void 0),Gi([o({type:Boolean})],Qi.prototype,"closeOnClickOutside",void 0),Gi([o({type:Boolean})],Qi.prototype,"closable",void 0),Gi([o({type:()=>Boolean})],Qi.prototype,"beforeClose",void 0),Gi([o()],Qi.prototype,"heading",void 0),Gi([o()],Qi.prototype,"icon",void 0),Gi([o()],Qi.prototype,"iconVariant",void 0),Gi([h({slot:"buttons"})],Qi.prototype,"buttons",void 0),c("ft-dialog")(Qi),t.FtDialog=Qi,t.FtDialogCssVariables=Xi,t.styles=Yi}({});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluid-topics/ft-dialog",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.4",
|
|
4
4
|
"description": "A simple dialog component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Lit"
|
|
@@ -19,11 +19,11 @@
|
|
|
19
19
|
"url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@fluid-topics/ft-button": "1.0.
|
|
23
|
-
"@fluid-topics/ft-icon": "1.0.
|
|
24
|
-
"@fluid-topics/ft-typography": "1.0.
|
|
25
|
-
"@fluid-topics/ft-wc-utils": "1.0.
|
|
22
|
+
"@fluid-topics/ft-button": "1.0.4",
|
|
23
|
+
"@fluid-topics/ft-icon": "1.0.4",
|
|
24
|
+
"@fluid-topics/ft-typography": "1.0.4",
|
|
25
|
+
"@fluid-topics/ft-wc-utils": "1.0.4",
|
|
26
26
|
"lit": "2.7.2"
|
|
27
27
|
},
|
|
28
|
-
"gitHead": "
|
|
28
|
+
"gitHead": "73efa63448237c9b05c59823cd70ee3bc019995e"
|
|
29
29
|
}
|