@nuralyui/tooltips 0.0.3 → 0.0.5
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/bundle.js +173 -0
- package/package.json +16 -2
- package/tooltips.component.d.ts +1 -1
- package/tooltips.style.js +6 -6
- package/tooltips.style.js.map +1 -1
- package/tooltips.variables.js +4 -4
- package/tooltips.variables.js.map +1 -1
- package/demo/tooltips-demo.d.ts +0 -18
- package/demo/tooltips-demo.d.ts.map +0 -1
- package/demo/tooltips-demo.js +0 -132
- package/demo/tooltips-demo.js.map +0 -1
- package/index.d.ts.map +0 -1
- package/react.d.ts.map +0 -1
- package/test/tooltips_test.d.ts +0 -2
- package/test/tooltips_test.d.ts.map +0 -1
- package/test/tooltips_test.js +0 -145
- package/test/tooltips_test.js.map +0 -1
- package/tooltips.component.d.ts.map +0 -1
- package/tooltips.constant.d.ts.map +0 -1
- package/tooltips.style.d.ts.map +0 -1
- package/tooltips.variables.d.ts.map +0 -1
package/bundle.js
ADDED
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2019 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
|
+
*/
|
|
6
|
+
const t=window,i=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),o=new WeakMap;class e{constructor(t,i,o){if(this._$cssResult$=!0,o!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=i}get styleSheet(){let t=this.o;const s=this.t;if(i&&void 0===t){const i=void 0!==s&&1===s.length;i&&(t=o.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&o.set(s,t))}return t}toString(){return this.cssText}}const n=(t,...i)=>{const o=1===t.length?t[0]:i.reduce(((i,s,o)=>i+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new e(o,t,s)},h=i?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let i="";for(const s of t.cssRules)i+=s.cssText;return(t=>new e("string"==typeof t?t:t+"",void 0,s))(i)})(t):t
|
|
7
|
+
/**
|
|
8
|
+
* @license
|
|
9
|
+
* Copyright 2017 Google LLC
|
|
10
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
11
|
+
*/;var r;const l=window,a=l.trustedTypes,c=a?a.emptyScript:"",d=l.reactiveElementPolyfillSupport,u={toAttribute(t,i){switch(i){case Boolean:t=t?c:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,i){let s=t;switch(i){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(t){s=null}}return s}},v=(t,i)=>i!==t&&(i==i||t==t),p={attribute:!0,type:String,converter:u,reflect:!1,hasChanged:v},f="finalized";class g extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this._$Eu()}static addInitializer(t){var i;this.finalize(),(null!==(i=this.h)&&void 0!==i?i:this.h=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((i,s)=>{const o=this._$Ep(s,i);void 0!==o&&(this._$Ev.set(o,s),t.push(o))})),t}static createProperty(t,i=p){if(i.state&&(i.attribute=!1),this.finalize(),this.elementProperties.set(t,i),!i.noAccessor&&!this.prototype.hasOwnProperty(t)){const s="symbol"==typeof t?Symbol():"__"+t,o=this.getPropertyDescriptor(t,s,i);void 0!==o&&Object.defineProperty(this.prototype,t,o)}}static getPropertyDescriptor(t,i,s){return{get(){return this[i]},set(o){const e=this[t];this[i]=o,this.requestUpdate(t,e,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||p}static finalize(){if(this.hasOwnProperty(f))return!1;this[f]=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.h&&(this.h=[...t.h]),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,i=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const s of i)this.createProperty(s,t[s])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const i=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const t of s)i.unshift(h(t))}else void 0!==t&&i.push(h(t));return i}static _$Ep(t,i){const s=i.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}_$Eu(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)))}addController(t){var i,s;(null!==(i=this._$ES)&&void 0!==i?i:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(s=t.hostConnected)||void 0===s||s.call(t))}removeController(t){var i;null===(i=this._$ES)||void 0===i||i.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t,i)=>{this.hasOwnProperty(i)&&(this._$Ei.set(i,this[i]),delete this[i])}))}createRenderRoot(){var s;const o=null!==(s=this.shadowRoot)&&void 0!==s?s:this.attachShadow(this.constructor.shadowRootOptions);return((s,o)=>{i?s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):o.forEach((i=>{const o=document.createElement("style"),e=t.litNonce;void 0!==e&&o.setAttribute("nonce",e),o.textContent=i.cssText,s.appendChild(o)}))})(o,this.constructor.elementStyles),o}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostConnected)||void 0===i?void 0:i.call(t)}))}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostDisconnected)||void 0===i?void 0:i.call(t)}))}attributeChangedCallback(t,i,s){this._$AK(t,s)}_$EO(t,i,s=p){var o;const e=this.constructor._$Ep(t,s);if(void 0!==e&&!0===s.reflect){const n=(void 0!==(null===(o=s.converter)||void 0===o?void 0:o.toAttribute)?s.converter:u).toAttribute(i,s.type);this._$El=t,null==n?this.removeAttribute(e):this.setAttribute(e,n),this._$El=null}}_$AK(t,i){var s;const o=this.constructor,e=o._$Ev.get(t);if(void 0!==e&&this._$El!==e){const t=o.getPropertyOptions(e),n="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==(null===(s=t.converter)||void 0===s?void 0:s.fromAttribute)?t.converter:u;this._$El=e,this[e]=n.fromAttribute(i,t.type),this._$El=null}}requestUpdate(t,i,s){let o=!0;void 0!==t&&(((s=s||this.constructor.getPropertyOptions(t)).hasChanged||v)(this[t],i)?(this._$AL.has(t)||this._$AL.set(t,i),!0===s.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,s))):o=!1),!this.isUpdatePending&&o&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,i)=>this[i]=t)),this._$Ei=void 0);let i=!1;const s=this._$AL;try{i=this.shouldUpdate(s),i?(this.willUpdate(s),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostUpdate)||void 0===i?void 0:i.call(t)})),this.update(s)):this._$Ek()}catch(t){throw i=!1,this._$Ek(),t}i&&this._$AE(s)}willUpdate(t){}_$AE(t){var i;null===(i=this._$ES)||void 0===i||i.forEach((t=>{var i;return null===(i=t.hostUpdated)||void 0===i?void 0:i.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,i)=>this._$EO(i,this[i],t))),this._$EC=void 0),this._$Ek()}updated(t){}firstUpdated(t){}}
|
|
12
|
+
/**
|
|
13
|
+
* @license
|
|
14
|
+
* Copyright 2017 Google LLC
|
|
15
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
16
|
+
*/
|
|
17
|
+
var m;g[f]=!0,g.elementProperties=new Map,g.elementStyles=[],g.shadowRootOptions={mode:"open"},null==d||d({ReactiveElement:g}),(null!==(r=l.reactiveElementVersions)&&void 0!==r?r:l.reactiveElementVersions=[]).push("1.6.3");const y=window,b=y.trustedTypes,$=b?b.createPolicy("lit-html",{createHTML:t=>t}):void 0,w="$lit$",x=`lit$${(Math.random()+"").slice(9)}$`,S="?"+x,k=`<${S}>`,A=document,C=()=>A.createComment(""),_=t=>null===t||"object"!=typeof t&&"function"!=typeof t,E=Array.isArray,T="[ \t\n\f\r]",j=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,U=/-->/g,M=/>/g,N=RegExp(`>|${T}(?:([^\\s"'>=/]+)(${T}*=${T}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),z=/'/g,O=/"/g,R=/^(?:script|style|textarea|title)$/i,I=Symbol.for("lit-noChange"),P=Symbol.for("lit-nothing"),L=new WeakMap,Z=A.createTreeWalker(A,129,null,!1);function B(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==$?$.createHTML(i):i}class D{constructor({strings:t,_$litType$:i},s){let o;this.parts=[];let e=0,n=0;const h=t.length-1,r=this.parts,[l,a]=((t,i)=>{const s=t.length-1,o=[];let e,n=2===i?"<svg>":"",h=j;for(let i=0;i<s;i++){const s=t[i];let r,l,a=-1,c=0;for(;c<s.length&&(h.lastIndex=c,l=h.exec(s),null!==l);)c=h.lastIndex,h===j?"!--"===l[1]?h=U:void 0!==l[1]?h=M:void 0!==l[2]?(R.test(l[2])&&(e=RegExp("</"+l[2],"g")),h=N):void 0!==l[3]&&(h=N):h===N?">"===l[0]?(h=null!=e?e:j,a=-1):void 0===l[1]?a=-2:(a=h.lastIndex-l[2].length,r=l[1],h=void 0===l[3]?N:'"'===l[3]?O:z):h===O||h===z?h=N:h===U||h===M?h=j:(h=N,e=void 0);const d=h===N&&t[i+1].startsWith("/>")?" ":"";n+=h===j?s+k:a>=0?(o.push(r),s.slice(0,a)+w+s.slice(a)+x+d):s+x+(-2===a?(o.push(void 0),i):d)}return[B(t,n+(t[s]||"<?>")+(2===i?"</svg>":"")),o]})(t,i);if(this.el=D.createElement(l,s),Z.currentNode=this.el.content,2===i){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(o=Z.nextNode())&&r.length<h;){if(1===o.nodeType){if(o.hasAttributes()){const t=[];for(const i of o.getAttributeNames())if(i.endsWith(w)||i.startsWith(x)){const s=a[n++];if(t.push(i),void 0!==s){const t=o.getAttribute(s.toLowerCase()+w).split(x),i=/([.?@])?(.*)/.exec(s);r.push({type:1,index:e,name:i[2],strings:t,ctor:"."===i[1]?q:"?"===i[1]?Y:"@"===i[1]?F:K})}else r.push({type:6,index:e})}for(const i of t)o.removeAttribute(i)}if(R.test(o.tagName)){const t=o.textContent.split(x),i=t.length-1;if(i>0){o.textContent=b?b.emptyScript:"";for(let s=0;s<i;s++)o.append(t[s],C()),Z.nextNode(),r.push({type:2,index:++e});o.append(t[i],C())}}}else if(8===o.nodeType)if(o.data===S)r.push({type:2,index:e});else{let t=-1;for(;-1!==(t=o.data.indexOf(x,t+1));)r.push({type:7,index:e}),t+=x.length-1}e++}}static createElement(t,i){const s=A.createElement("template");return s.innerHTML=t,s}}function H(t,i,s=t,o){var e,n,h,r;if(i===I)return i;let l=void 0!==o?null===(e=s._$Co)||void 0===e?void 0:e[o]:s._$Cl;const a=_(i)?void 0:i._$litDirective$;return(null==l?void 0:l.constructor)!==a&&(null===(n=null==l?void 0:l._$AO)||void 0===n||n.call(l,!1),void 0===a?l=void 0:(l=new a(t),l._$AT(t,s,o)),void 0!==o?(null!==(h=(r=s)._$Co)&&void 0!==h?h:r._$Co=[])[o]=l:s._$Cl=l),void 0!==l&&(i=H(t,l._$AS(t,i.values),l,o)),i}class W{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var i;const{el:{content:s},parts:o}=this._$AD,e=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:A).importNode(s,!0);Z.currentNode=e;let n=Z.nextNode(),h=0,r=0,l=o[0];for(;void 0!==l;){if(h===l.index){let i;2===l.type?i=new J(n,n.nextSibling,this,t):1===l.type?i=new l.ctor(n,l.name,l.strings,this,t):6===l.type&&(i=new G(n,this,t)),this._$AV.push(i),l=o[++r]}h!==(null==l?void 0:l.index)&&(n=Z.nextNode(),h++)}return Z.currentNode=A,e}v(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++}}class J{constructor(t,i,s,o){var e;this.type=2,this._$AH=P,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=o,this._$Cp=null===(e=null==o?void 0:o.isConnected)||void 0===e||e}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cp}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===(null==t?void 0:t.nodeType)&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=H(this,t,i),_(t)?t===P||null==t||""===t?(this._$AH!==P&&this._$AR(),this._$AH=P):t!==this._$AH&&t!==I&&this._(t):void 0!==t._$litType$?this.g(t):void 0!==t.nodeType?this.$(t):(t=>E(t)||"function"==typeof(null==t?void 0:t[Symbol.iterator]))(t)?this.T(t):this._(t)}k(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}$(t){this._$AH!==t&&(this._$AR(),this._$AH=this.k(t))}_(t){this._$AH!==P&&_(this._$AH)?this._$AA.nextSibling.data=t:this.$(A.createTextNode(t)),this._$AH=t}g(t){var i;const{values:s,_$litType$:o}=t,e="number"==typeof o?this._$AC(t):(void 0===o.el&&(o.el=D.createElement(B(o.h,o.h[0]),this.options)),o);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===e)this._$AH.v(s);else{const t=new W(e,this),i=t.u(this.options);t.v(s),this.$(i),this._$AH=t}}_$AC(t){let i=L.get(t.strings);return void 0===i&&L.set(t.strings,i=new D(t)),i}T(t){E(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,o=0;for(const e of t)o===i.length?i.push(s=new J(this.k(C()),this.k(C()),this,this.options)):s=i[o],s._$AI(e),o++;o<i.length&&(this._$AR(s&&s._$AB.nextSibling,o),i.length=o)}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cp=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class K{constructor(t,i,s,o,e){this.type=1,this._$AH=P,this._$AN=void 0,this.element=t,this.name=i,this._$AM=o,this.options=e,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=P}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,o){const e=this.strings;let n=!1;if(void 0===e)t=H(this,t,i,0),n=!_(t)||t!==this._$AH&&t!==I,n&&(this._$AH=t);else{const o=t;let h,r;for(t=e[0],h=0;h<e.length-1;h++)r=H(this,o[s+h],i,h),r===I&&(r=this._$AH[h]),n||(n=!_(r)||r!==this._$AH[h]),r===P?t=P:t!==P&&(t+=(null!=r?r:"")+e[h+1]),this._$AH[h]=r}n&&!o&&this.j(t)}j(t){t===P?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class q extends K{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===P?void 0:t}}const V=b?b.emptyScript:"";class Y extends K{constructor(){super(...arguments),this.type=4}j(t){t&&t!==P?this.element.setAttribute(this.name,V):this.element.removeAttribute(this.name)}}class F extends K{constructor(t,i,s,o,e){super(t,i,s,o,e),this.type=5}_$AI(t,i=this){var s;if((t=null!==(s=H(this,t,i,0))&&void 0!==s?s:P)===I)return;const o=this._$AH,e=t===P&&o!==P||t.capture!==o.capture||t.once!==o.once||t.passive!==o.passive,n=t!==P&&(o===P||e);e&&this.element.removeEventListener(this.name,this,o),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class G{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){H(this,t)}}const Q=y.litHtmlPolyfillSupport;
|
|
18
|
+
/**
|
|
19
|
+
* @license
|
|
20
|
+
* Copyright 2017 Google LLC
|
|
21
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
22
|
+
*/
|
|
23
|
+
var X;null==Q||Q(D,J),(null!==(m=y.litHtmlVersions)&&void 0!==m?m:y.litHtmlVersions=[]).push("2.8.0");const tt=window,it=tt.trustedTypes,st=it?it.createPolicy("lit-html",{createHTML:t=>t}):void 0,ot="$lit$",et=`lit$${(Math.random()+"").slice(9)}$`,nt="?"+et,ht=`<${nt}>`,rt=document,lt=()=>rt.createComment(""),at=t=>null===t||"object"!=typeof t&&"function"!=typeof t,ct=Array.isArray,dt="[ \t\n\f\r]",ut=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,vt=/-->/g,pt=/>/g,ft=RegExp(`>|${dt}(?:([^\\s"'>=/]+)(${dt}*=${dt}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),gt=/'/g,mt=/"/g,yt=/^(?:script|style|textarea|title)$/i,bt=(t=>(i,...s)=>({_$litType$:t,strings:i,values:s}))(1),$t=Symbol.for("lit-noChange"),wt=Symbol.for("lit-nothing"),xt=new WeakMap,St=rt.createTreeWalker(rt,129,null,!1);function kt(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==st?st.createHTML(i):i}const At=(t,i)=>{const s=t.length-1,o=[];let e,n=2===i?"<svg>":"",h=ut;for(let i=0;i<s;i++){const s=t[i];let r,l,a=-1,c=0;for(;c<s.length&&(h.lastIndex=c,l=h.exec(s),null!==l);)c=h.lastIndex,h===ut?"!--"===l[1]?h=vt:void 0!==l[1]?h=pt:void 0!==l[2]?(yt.test(l[2])&&(e=RegExp("</"+l[2],"g")),h=ft):void 0!==l[3]&&(h=ft):h===ft?">"===l[0]?(h=null!=e?e:ut,a=-1):void 0===l[1]?a=-2:(a=h.lastIndex-l[2].length,r=l[1],h=void 0===l[3]?ft:'"'===l[3]?mt:gt):h===mt||h===gt?h=ft:h===vt||h===pt?h=ut:(h=ft,e=void 0);const d=h===ft&&t[i+1].startsWith("/>")?" ":"";n+=h===ut?s+ht:a>=0?(o.push(r),s.slice(0,a)+ot+s.slice(a)+et+d):s+et+(-2===a?(o.push(void 0),i):d)}return[kt(t,n+(t[s]||"<?>")+(2===i?"</svg>":"")),o]};class Ct{constructor({strings:t,_$litType$:i},s){let o;this.parts=[];let e=0,n=0;const h=t.length-1,r=this.parts,[l,a]=At(t,i);if(this.el=Ct.createElement(l,s),St.currentNode=this.el.content,2===i){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(o=St.nextNode())&&r.length<h;){if(1===o.nodeType){if(o.hasAttributes()){const t=[];for(const i of o.getAttributeNames())if(i.endsWith(ot)||i.startsWith(et)){const s=a[n++];if(t.push(i),void 0!==s){const t=o.getAttribute(s.toLowerCase()+ot).split(et),i=/([.?@])?(.*)/.exec(s);r.push({type:1,index:e,name:i[2],strings:t,ctor:"."===i[1]?Ut:"?"===i[1]?Nt:"@"===i[1]?zt:jt})}else r.push({type:6,index:e})}for(const i of t)o.removeAttribute(i)}if(yt.test(o.tagName)){const t=o.textContent.split(et),i=t.length-1;if(i>0){o.textContent=it?it.emptyScript:"";for(let s=0;s<i;s++)o.append(t[s],lt()),St.nextNode(),r.push({type:2,index:++e});o.append(t[i],lt())}}}else if(8===o.nodeType)if(o.data===nt)r.push({type:2,index:e});else{let t=-1;for(;-1!==(t=o.data.indexOf(et,t+1));)r.push({type:7,index:e}),t+=et.length-1}e++}}static createElement(t,i){const s=rt.createElement("template");return s.innerHTML=t,s}}function _t(t,i,s=t,o){var e,n,h,r;if(i===$t)return i;let l=void 0!==o?null===(e=s._$Co)||void 0===e?void 0:e[o]:s._$Cl;const a=at(i)?void 0:i._$litDirective$;return(null==l?void 0:l.constructor)!==a&&(null===(n=null==l?void 0:l._$AO)||void 0===n||n.call(l,!1),void 0===a?l=void 0:(l=new a(t),l._$AT(t,s,o)),void 0!==o?(null!==(h=(r=s)._$Co)&&void 0!==h?h:r._$Co=[])[o]=l:s._$Cl=l),void 0!==l&&(i=_t(t,l._$AS(t,i.values),l,o)),i}class Et{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var i;const{el:{content:s},parts:o}=this._$AD,e=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:rt).importNode(s,!0);St.currentNode=e;let n=St.nextNode(),h=0,r=0,l=o[0];for(;void 0!==l;){if(h===l.index){let i;2===l.type?i=new Tt(n,n.nextSibling,this,t):1===l.type?i=new l.ctor(n,l.name,l.strings,this,t):6===l.type&&(i=new Ot(n,this,t)),this._$AV.push(i),l=o[++r]}h!==(null==l?void 0:l.index)&&(n=St.nextNode(),h++)}return St.currentNode=rt,e}v(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++}}class Tt{constructor(t,i,s,o){var e;this.type=2,this._$AH=wt,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=o,this._$Cp=null===(e=null==o?void 0:o.isConnected)||void 0===e||e}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cp}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===(null==t?void 0:t.nodeType)&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=_t(this,t,i),at(t)?t===wt||null==t||""===t?(this._$AH!==wt&&this._$AR(),this._$AH=wt):t!==this._$AH&&t!==$t&&this._(t):void 0!==t._$litType$?this.g(t):void 0!==t.nodeType?this.$(t):(t=>ct(t)||"function"==typeof(null==t?void 0:t[Symbol.iterator]))(t)?this.T(t):this._(t)}k(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}$(t){this._$AH!==t&&(this._$AR(),this._$AH=this.k(t))}_(t){this._$AH!==wt&&at(this._$AH)?this._$AA.nextSibling.data=t:this.$(rt.createTextNode(t)),this._$AH=t}g(t){var i;const{values:s,_$litType$:o}=t,e="number"==typeof o?this._$AC(t):(void 0===o.el&&(o.el=Ct.createElement(kt(o.h,o.h[0]),this.options)),o);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===e)this._$AH.v(s);else{const t=new Et(e,this),i=t.u(this.options);t.v(s),this.$(i),this._$AH=t}}_$AC(t){let i=xt.get(t.strings);return void 0===i&&xt.set(t.strings,i=new Ct(t)),i}T(t){ct(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,o=0;for(const e of t)o===i.length?i.push(s=new Tt(this.k(lt()),this.k(lt()),this,this.options)):s=i[o],s._$AI(e),o++;o<i.length&&(this._$AR(s&&s._$AB.nextSibling,o),i.length=o)}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cp=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class jt{constructor(t,i,s,o,e){this.type=1,this._$AH=wt,this._$AN=void 0,this.element=t,this.name=i,this._$AM=o,this.options=e,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=wt}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,o){const e=this.strings;let n=!1;if(void 0===e)t=_t(this,t,i,0),n=!at(t)||t!==this._$AH&&t!==$t,n&&(this._$AH=t);else{const o=t;let h,r;for(t=e[0],h=0;h<e.length-1;h++)r=_t(this,o[s+h],i,h),r===$t&&(r=this._$AH[h]),n||(n=!at(r)||r!==this._$AH[h]),r===wt?t=wt:t!==wt&&(t+=(null!=r?r:"")+e[h+1]),this._$AH[h]=r}n&&!o&&this.j(t)}j(t){t===wt?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class Ut extends jt{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===wt?void 0:t}}const Mt=it?it.emptyScript:"";class Nt extends jt{constructor(){super(...arguments),this.type=4}j(t){t&&t!==wt?this.element.setAttribute(this.name,Mt):this.element.removeAttribute(this.name)}}class zt extends jt{constructor(t,i,s,o,e){super(t,i,s,o,e),this.type=5}_$AI(t,i=this){var s;if((t=null!==(s=_t(this,t,i,0))&&void 0!==s?s:wt)===$t)return;const o=this._$AH,e=t===wt&&o!==wt||t.capture!==o.capture||t.once!==o.once||t.passive!==o.passive,n=t!==wt&&(o===wt||e);e&&this.element.removeEventListener(this.name,this,o),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class Ot{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){_t(this,t)}}const Rt=tt.litHtmlPolyfillSupport;null==Rt||Rt(Ct,Tt),(null!==(X=tt.litHtmlVersions)&&void 0!==X?X:tt.litHtmlVersions=[]).push("2.8.0");
|
|
24
|
+
/**
|
|
25
|
+
* @license
|
|
26
|
+
* Copyright 2017 Google LLC
|
|
27
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
28
|
+
*/
|
|
29
|
+
var It,Pt;class Lt extends g{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t,i;const s=super.createRenderRoot();return null!==(t=(i=this.renderOptions).renderBefore)&&void 0!==t||(i.renderBefore=s.firstChild),s}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=((t,i,s)=>{var o,e;const n=null!==(o=null==s?void 0:s.renderBefore)&&void 0!==o?o:i;let h=n._$litPart$;if(void 0===h){const t=null!==(e=null==s?void 0:s.renderBefore)&&void 0!==e?e:null;n._$litPart$=h=new Tt(i.insertBefore(lt(),t),t,void 0,null!=s?s:{})}return h._$AI(t),h})(i,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!1)}render(){return $t}}Lt.finalized=!0,Lt._$litElement$=!0,null===(It=globalThis.litElementHydrateSupport)||void 0===It||It.call(globalThis,{LitElement:Lt});const Zt=globalThis.litElementPolyfillSupport;null==Zt||Zt({LitElement:Lt}),(null!==(Pt=globalThis.litElementVersions)&&void 0!==Pt?Pt:globalThis.litElementVersions=[]).push("3.3.3");
|
|
30
|
+
/**
|
|
31
|
+
* @license
|
|
32
|
+
* Copyright 2017 Google LLC
|
|
33
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
34
|
+
*/
|
|
35
|
+
const Bt=(t,i)=>"method"===i.kind&&i.descriptor&&!("value"in i.descriptor)?{...i,finisher(s){s.createProperty(i.key,t)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:i.key,initializer(){"function"==typeof i.initializer&&(this[i.key]=i.initializer.call(this))},finisher(s){s.createProperty(i.key,t)}},Dt=(t,i,s)=>{i.constructor.createProperty(s,t)};
|
|
36
|
+
/**
|
|
37
|
+
* @license
|
|
38
|
+
* Copyright 2017 Google LLC
|
|
39
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
40
|
+
*/function Ht(t){return(i,s)=>void 0!==s?Dt(t,i,s):Bt(t,i)
|
|
41
|
+
/**
|
|
42
|
+
* @license
|
|
43
|
+
* Copyright 2017 Google LLC
|
|
44
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
45
|
+
*/}
|
|
46
|
+
/**
|
|
47
|
+
* @license
|
|
48
|
+
* Copyright 2021 Google LLC
|
|
49
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
50
|
+
*/
|
|
51
|
+
var Wt;null===(Wt=window.HTMLSlotElement)||void 0===Wt||Wt.prototype.assignedElements;const Jt=[n`
|
|
52
|
+
:host([show]) {
|
|
53
|
+
background-color: var(--nuraly-tooltip-background-color);
|
|
54
|
+
color: var(--nuraly-tooltip-text-color);
|
|
55
|
+
position: fixed;
|
|
56
|
+
padding: 5px;
|
|
57
|
+
text-align: center;
|
|
58
|
+
opacity: 0;
|
|
59
|
+
font-size: 14px;
|
|
60
|
+
z-index: 9999;
|
|
61
|
+
border-radius: 4px;
|
|
62
|
+
animation-name: show-animation;
|
|
63
|
+
animation-duration: 0.4s;
|
|
64
|
+
animation-fill-mode: forwards;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.popconfirm-container {
|
|
68
|
+
display: flex;
|
|
69
|
+
flex-direction: column;
|
|
70
|
+
}
|
|
71
|
+
.btn-block {
|
|
72
|
+
display: flex;
|
|
73
|
+
justify-content: end;
|
|
74
|
+
gap: 10px;
|
|
75
|
+
margin: 10px;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.popconfirm-description,
|
|
79
|
+
.popconfirm-title {
|
|
80
|
+
margin: 5px;
|
|
81
|
+
text-align: left;
|
|
82
|
+
}
|
|
83
|
+
.popconfirm-title {
|
|
84
|
+
font-weight: bold;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
@keyframes show-animation {
|
|
88
|
+
from {
|
|
89
|
+
opacity: 0;
|
|
90
|
+
}
|
|
91
|
+
to {
|
|
92
|
+
opacity: 1;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
:host::after {
|
|
97
|
+
content: '';
|
|
98
|
+
height: 0;
|
|
99
|
+
width: 0;
|
|
100
|
+
position: absolute;
|
|
101
|
+
border: 5px solid transparent;
|
|
102
|
+
}
|
|
103
|
+
:host(.top-position)::after {
|
|
104
|
+
border-top-color: var(--nuraly-tooltip-background-color);
|
|
105
|
+
top: 100%;
|
|
106
|
+
}
|
|
107
|
+
:host(.left-position)::after {
|
|
108
|
+
border-left-color: var(--nuraly-tooltip-background-color);
|
|
109
|
+
left: 100%;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
:host(.right-position)::after {
|
|
113
|
+
border-right-color: var(--nuraly-tooltip-background-color);
|
|
114
|
+
right: 100%;
|
|
115
|
+
}
|
|
116
|
+
:host(.bottom-position)::after {
|
|
117
|
+
border-bottom-color: var(--nuraly-tooltip-background-color);
|
|
118
|
+
bottom: 100%;
|
|
119
|
+
}
|
|
120
|
+
:host(.alignement-center.top-position)::after,
|
|
121
|
+
:host(.alignement-center.bottom-position)::after {
|
|
122
|
+
right: 50%;
|
|
123
|
+
transform: translate(50%);
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
:host(.alignement-start.top-position)::after,
|
|
127
|
+
:host(.alignement-start.bottom-position)::after {
|
|
128
|
+
left: 4%;
|
|
129
|
+
}
|
|
130
|
+
:host(.top-position.alignement-end)::after,
|
|
131
|
+
:host(.alignement-end.bottom-position)::after {
|
|
132
|
+
right: 4%;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
:host(.alignement-center.left-position)::after,
|
|
136
|
+
:host(.alignement-center.right-position)::after {
|
|
137
|
+
top: 50%;
|
|
138
|
+
transform: translate(0%, -50%);
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
:host(.alignement-start.left-position)::after,
|
|
142
|
+
:host(.alignement-start.right-position)::after {
|
|
143
|
+
top: 5px;
|
|
144
|
+
}
|
|
145
|
+
:host(.alignement-end.left-position)::after,
|
|
146
|
+
:host(.alignement-end.right-position)::after {
|
|
147
|
+
bottom: 5px;
|
|
148
|
+
}
|
|
149
|
+
`,n`
|
|
150
|
+
:host {
|
|
151
|
+
--nuraly-tooltip-background-color: #393939;
|
|
152
|
+
--nuraly-tooltip-text-color: #ffffff;
|
|
153
|
+
}
|
|
154
|
+
@media (prefers-color-scheme: dark) {
|
|
155
|
+
:host {
|
|
156
|
+
--nuraly-tooltip-background-color: #f4f4f4;
|
|
157
|
+
--nuraly-tooltip-text-color: #161616;
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
`];var Kt,qt;!function(t){t.Top="top",t.Bottom="bottom",t.Right="right",t.Left="left"}(Kt||(Kt={})),function(t){t.Start="start",t.Center="center",t.End="end"}(qt||(qt={}));var Vt=function(t,i,s,o){for(var e,n=arguments.length,h=n<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,s):o,r=t.length-1;r>=0;r--)(e=t[r])&&(h=(n<3?e(h):n>3?e(i,s,h):e(i,s))||h);return n>3&&h&&Object.defineProperty(i,s,h),h};let Yt=class extends Lt{constructor(){super(...arguments),this.position=Kt.Bottom,this.alignement=qt.Center,this.show=!1,this.isPopConfirm=!1,this.popConfirmTitle="",this.popConfirmDescription="",this.okText="Yes",this.cancelText="No",this.horizontalOffset=10,this.verticalOffset=10,this.onMouseOver=()=>{this.show=!0},this.onMouseLeave=()=>{this.show=!1,this.initStyles()},this.onClick=()=>{this.show=!this.show},this.calculatePosition=()=>{this.initStyles(),this.style.width=`${this.clientWidth}px`,this.position==Kt.Bottom||this.position==Kt.Top?(this.calculateYposition(),this.calculateYalignement()):(this.calculateXposition(),this.calculateXalignement())},this.calculateYposition=()=>{const t=this.target.getBoundingClientRect(),i=t.bottom,s=t.top,o=window.visualViewport.height,e=this.clientHeight,n=e+this.verticalOffset<o-i,h=e+this.verticalOffset<s;this.position==Kt.Bottom?n||!h?(this.classList.add("bottom-position"),this.style.top=`${i+this.verticalOffset}px`):(this.classList.add("top-position"),this.style.top=s-e-this.verticalOffset+"px"):h||!n?(this.classList.add("top-position"),this.style.top=s-e-this.verticalOffset+"px"):(this.classList.add("bottom-position"),this.style.top=`${i+this.verticalOffset}px`)},this.calculateYalignement=()=>{const t=this.target.getBoundingClientRect(),i=t.right,s=t.width,o=t.left,e=this.clientWidth,n=o+s/2,h=window.visualViewport.width,r=h-i+s/2;if(this.alignement==qt.Start){e+o<h?(this.classList.add("alignement-start"),this.style.left=o-this.horizontalOffset+"px"):(this.classList.add("alignement-end"),this.style.left=`${o-e+this.horizontalOffset}px`)}else if(this.alignement==qt.End){e<o?(this.classList.add("alignement-end"),this.style.left=`${o-e+this.horizontalOffset}px`):(this.classList.add("alignement-start"),this.style.left=o-this.horizontalOffset+"px")}else{const t=e<n;e/2<n&&e/2<r||e>n&&e>r?(this.classList.add("alignement-center"),this.style.left=o-e/2+s/2+"px"):t?(this.classList.add("alignement-end"),this.style.left=`${o-e+this.horizontalOffset}px`):(this.classList.add("alignement-start"),this.style.left=o-this.horizontalOffset+"px")}},this.calculateXposition=()=>{const t=this.target.getBoundingClientRect(),i=t.left,s=t.right,o=window.visualViewport.width,e=this.clientWidth,n=e+this.horizontalOffset<o-s,h=e+this.horizontalOffset<i;this.position==Kt.Right?n||!h?(this.classList.add("right-position"),this.style.left=`${s+this.horizontalOffset}px`):(this.classList.add("left-position"),this.style.left=i-e-this.horizontalOffset+"px"):h||!n?(this.classList.add("left-position"),this.style.left=i-e-this.horizontalOffset+"px"):(this.classList.add("right-position"),this.style.left=`${s+this.horizontalOffset}px`)},this.calculateXalignement=()=>{const t=this.target.getBoundingClientRect(),i=t.top,s=t.height,o=t.bottom,e=this.clientHeight,n=window.visualViewport.height,h=n-o;if(this.alignement==qt.End){e<i?(this.classList.add("alignement-end"),this.style.top=o-e+"px"):(this.classList.add("alignement-start"),this.style.top=i-s/4+"px")}else if(this.alignement==qt.Start){e<n-o?(this.classList.add("alignement-start"),this.style.top=i-s/4+"px"):(this.classList.add("alignement-end"),this.style.top=o-e+"px")}else{const t=e<i;e/2<i&&e/2<h||e>i&&e>h?(this.classList.add("alignement-center"),this.style.top=i+s/2-e/2+"px"):t?(this.classList.add("alignement-end"),this.style.top=o-e+"px"):(this.classList.add("alignement-start"),this.style.top=i-s/4+"px")}},this.onClickOutside=t=>{const i=t.composedPath();!i.includes(this.target)&&!i.includes(this)&&(this.show=!1)}}connectedCallback(){super.connectedCallback(),this.target=this.target||this.previousElementSibling,this.target?this.isPopConfirm?(document.addEventListener("scroll",this.calculatePosition),this.target.addEventListener("click",this.onClick),document.addEventListener("click",this.onClickOutside)):(this.target.addEventListener("mouseover",this.onMouseOver),this.target.addEventListener("mouseleave",this.onMouseLeave)):console.error("Tooltip target is not defined or found. Ensure target is explicitly set or precedes the tooltip.")}initStyles(){this.style.top="",this.style.left="",this.style.width="",this.classList.remove(...this.classList.values())}updated(t){this.show&&this.calculatePosition()}onPopConfirmCancel(){this.dispatchEvent(new CustomEvent("onCancel")),this.show=!1,this.initStyles()}onPopConfirmConfirm(){this.dispatchEvent(new CustomEvent("onConfirm")),this.show=!1,this.initStyles()}disconnectedCallback(){super.disconnectedCallback(),this.isPopConfirm?(this.target.removeEventListener("click",this.onClick),document.removeEventListener("scroll",this.calculatePosition)):(this.target.removeEventListener("mouseover",this.onMouseOver),this.target.removeEventListener("mouseleave",this.onMouseLeave))}render(){return this.isPopConfirm?this.show?bt`
|
|
161
|
+
<div class="popconfirm-container">
|
|
162
|
+
<p class="popconfirm-title">${this.popConfirmTitle}</p>
|
|
163
|
+
<p class="popconfirm-description">${this.popConfirmDescription}</p>
|
|
164
|
+
<div class="btn-block">
|
|
165
|
+
<nr-button .size=${"small"} type=${"primary"} @click=${this.onPopConfirmConfirm}
|
|
166
|
+
>${this.okText}</nr-button
|
|
167
|
+
>
|
|
168
|
+
<nr-button .size=${"small"} type=${"danger"} @click=${this.onPopConfirmCancel}
|
|
169
|
+
>${this.cancelText}</nr-button
|
|
170
|
+
>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
`:wt:this.show?bt`<slot></slot>`:wt}};Yt.styles=Jt,Vt([Ht({reflect:!0})],Yt.prototype,"position",void 0),Vt([Ht({reflect:!0})],Yt.prototype,"alignement",void 0),Vt([function(t){return Ht({...t,state:!0})}()],Yt.prototype,"target",void 0),Vt([Ht({reflect:!0,type:Boolean})],Yt.prototype,"show",void 0),Vt([Ht()],Yt.prototype,"isPopConfirm",void 0),Vt([Ht()],Yt.prototype,"popConfirmTitle",void 0),Vt([Ht()],Yt.prototype,"popConfirmDescription",void 0),Vt([Ht()],Yt.prototype,"okText",void 0),Vt([Ht()],Yt.prototype,"cancelText",void 0),Yt=Vt([(t=>i=>"function"==typeof i?((t,i)=>(customElements.define(t,i),i))(t,i):((t,i)=>{const{kind:s,elements:o}=i;return{kind:s,elements:o,finisher(i){customElements.define(t,i)}}})(t,i))("hy-tooltip")],Yt);export{Yt as TooltipElement};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nuralyui/tooltips",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.5",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"type": "module",
|
|
@@ -11,5 +11,19 @@
|
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1"
|
|
12
12
|
},
|
|
13
13
|
"author": "Labidi Aymen",
|
|
14
|
-
"license": "ISC"
|
|
14
|
+
"license": "ISC",
|
|
15
|
+
"exports": {
|
|
16
|
+
".": {
|
|
17
|
+
"import": "./index.js"
|
|
18
|
+
},
|
|
19
|
+
"./bundle": {
|
|
20
|
+
"import": "./bundle.js"
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"files": [
|
|
24
|
+
"bundle.js",
|
|
25
|
+
"*.js",
|
|
26
|
+
"*.d.ts",
|
|
27
|
+
"*.js.map"
|
|
28
|
+
]
|
|
15
29
|
}
|
package/tooltips.component.d.ts
CHANGED
|
@@ -28,6 +28,6 @@ export declare class TooltipElement extends LitElement {
|
|
|
28
28
|
onPopConfirmConfirm(): void;
|
|
29
29
|
onClickOutside: (onClickEvent: Event) => void;
|
|
30
30
|
disconnectedCallback(): void;
|
|
31
|
-
render():
|
|
31
|
+
render(): import("lit").TemplateResult<1> | typeof nothing;
|
|
32
32
|
}
|
|
33
33
|
//# sourceMappingURL=tooltips.component.d.ts.map
|
package/tooltips.style.js
CHANGED
|
@@ -2,8 +2,8 @@ import { css } from 'lit';
|
|
|
2
2
|
import { styleVariables } from './tooltips.variables.js';
|
|
3
3
|
const tooltipStyles = css `
|
|
4
4
|
:host([show]) {
|
|
5
|
-
background-color: var(--
|
|
6
|
-
color: var(--
|
|
5
|
+
background-color: var(--nuraly-tooltip-background-color);
|
|
6
|
+
color: var(--nuraly-tooltip-text-color);
|
|
7
7
|
position: fixed;
|
|
8
8
|
padding: 5px;
|
|
9
9
|
text-align: center;
|
|
@@ -53,20 +53,20 @@ const tooltipStyles = css `
|
|
|
53
53
|
border: 5px solid transparent;
|
|
54
54
|
}
|
|
55
55
|
:host(.top-position)::after {
|
|
56
|
-
border-top-color: var(--
|
|
56
|
+
border-top-color: var(--nuraly-tooltip-background-color);
|
|
57
57
|
top: 100%;
|
|
58
58
|
}
|
|
59
59
|
:host(.left-position)::after {
|
|
60
|
-
border-left-color: var(--
|
|
60
|
+
border-left-color: var(--nuraly-tooltip-background-color);
|
|
61
61
|
left: 100%;
|
|
62
62
|
}
|
|
63
63
|
|
|
64
64
|
:host(.right-position)::after {
|
|
65
|
-
border-right-color: var(--
|
|
65
|
+
border-right-color: var(--nuraly-tooltip-background-color);
|
|
66
66
|
right: 100%;
|
|
67
67
|
}
|
|
68
68
|
:host(.bottom-position)::after {
|
|
69
|
-
border-bottom-color: var(--
|
|
69
|
+
border-bottom-color: var(--nuraly-tooltip-background-color);
|
|
70
70
|
bottom: 100%;
|
|
71
71
|
}
|
|
72
72
|
:host(.alignement-center.top-position)::after,
|
package/tooltips.style.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips.style.js","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.style.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"tooltips.style.js","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAEzD,MAAM,aAAa,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkGxB,CAAC;AACF,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import { css } from 'lit';\nimport { styleVariables } from './tooltips.variables.js';\n\nconst tooltipStyles = css`\n :host([show]) {\n background-color: var(--nuraly-tooltip-background-color);\n color: var(--nuraly-tooltip-text-color);\n position: fixed;\n padding: 5px;\n text-align: center;\n opacity: 0;\n font-size: 14px;\n z-index: 9999;\n border-radius: 4px;\n animation-name: show-animation;\n animation-duration: 0.4s;\n animation-fill-mode: forwards;\n }\n\n .popconfirm-container {\n display: flex;\n flex-direction: column;\n }\n .btn-block {\n display: flex;\n justify-content: end;\n gap: 10px;\n margin: 10px;\n }\n\n .popconfirm-description,\n .popconfirm-title {\n margin: 5px;\n text-align: left;\n }\n .popconfirm-title {\n font-weight: bold;\n }\n\n @keyframes show-animation {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n :host::after {\n content: '';\n height: 0;\n width: 0;\n position: absolute;\n border: 5px solid transparent;\n }\n :host(.top-position)::after {\n border-top-color: var(--nuraly-tooltip-background-color);\n top: 100%;\n }\n :host(.left-position)::after {\n border-left-color: var(--nuraly-tooltip-background-color);\n left: 100%;\n }\n\n :host(.right-position)::after {\n border-right-color: var(--nuraly-tooltip-background-color);\n right: 100%;\n }\n :host(.bottom-position)::after {\n border-bottom-color: var(--nuraly-tooltip-background-color);\n bottom: 100%;\n }\n :host(.alignement-center.top-position)::after,\n :host(.alignement-center.bottom-position)::after {\n right: 50%;\n transform: translate(50%);\n }\n\n :host(.alignement-start.top-position)::after,\n :host(.alignement-start.bottom-position)::after {\n left: 4%;\n }\n :host(.top-position.alignement-end)::after,\n :host(.alignement-end.bottom-position)::after {\n right: 4%;\n }\n\n :host(.alignement-center.left-position)::after,\n :host(.alignement-center.right-position)::after {\n top: 50%;\n transform: translate(0%, -50%);\n }\n\n :host(.alignement-start.left-position)::after,\n :host(.alignement-start.right-position)::after {\n top: 5px;\n }\n :host(.alignement-end.left-position)::after,\n :host(.alignement-end.right-position)::after {\n bottom: 5px;\n }\n`;\nexport const styles = [tooltipStyles, styleVariables];\n"]}
|
package/tooltips.variables.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
2
|
export const styleVariables = css `
|
|
3
3
|
:host {
|
|
4
|
-
--
|
|
5
|
-
--
|
|
4
|
+
--nuraly-tooltip-background-color: #393939;
|
|
5
|
+
--nuraly-tooltip-text-color: #ffffff;
|
|
6
6
|
}
|
|
7
7
|
@media (prefers-color-scheme: dark) {
|
|
8
8
|
:host {
|
|
9
|
-
--
|
|
10
|
-
--
|
|
9
|
+
--nuraly-tooltip-background-color: #f4f4f4;
|
|
10
|
+
--nuraly-tooltip-text-color: #161616;
|
|
11
11
|
}
|
|
12
12
|
}
|
|
13
13
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips.variables.js","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.variables.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"tooltips.variables.js","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.variables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;CAWhC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styleVariables = css`\n :host {\n --nuraly-tooltip-background-color: #393939;\n --nuraly-tooltip-text-color: #ffffff;\n }\n @media (prefers-color-scheme: dark) {\n :host {\n --nuraly-tooltip-background-color: #f4f4f4;\n --nuraly-tooltip-text-color: #161616;\n }\n }\n`;\n"]}
|
package/demo/tooltips-demo.d.ts
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright 2023 Google Laabidi Aymen
|
|
4
|
-
* SPDX-License-Identifier: MIT
|
|
5
|
-
*/
|
|
6
|
-
import { LitElement } from 'lit';
|
|
7
|
-
import '../tooltips.component';
|
|
8
|
-
export declare class ElMeenuElement extends LitElement {
|
|
9
|
-
float: string;
|
|
10
|
-
protected render(): import("lit").TemplateResult<1>;
|
|
11
|
-
static styles: import("lit").CSSResult[];
|
|
12
|
-
}
|
|
13
|
-
declare global {
|
|
14
|
-
interface HTMLElementTagNameMap {
|
|
15
|
-
'hy-tooltips-demo': ElMeenuElement;
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
//# sourceMappingURL=tooltips-demo.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips-demo.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltips/demo/tooltips-demo.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,EAAC,UAAU,EAAY,MAAM,KAAK,CAAC;AAG1C,OAAO,uBAAuB,CAAC;AAE/B,qBACa,cAAe,SAAQ,UAAU;IAE5C,KAAK,SAAU;cAEI,MAAM;IA6FzB,OAAgB,MAAM,4BASpB;CACH;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,cAAc,CAAC;KACpC;CACF"}
|
package/demo/tooltips-demo.js
DELETED
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
|
-
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
3
|
-
/**
|
|
4
|
-
* @license
|
|
5
|
-
* Copyright 2023 Google Laabidi Aymen
|
|
6
|
-
* SPDX-License-Identifier: MIT
|
|
7
|
-
*/
|
|
8
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
9
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
10
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
11
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
12
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
13
|
-
};
|
|
14
|
-
import { LitElement, css, html } from 'lit';
|
|
15
|
-
import { customElement, state } from 'lit/decorators.js';
|
|
16
|
-
import '../tooltips.component';
|
|
17
|
-
let ElMeenuElement = class ElMeenuElement extends LitElement {
|
|
18
|
-
constructor() {
|
|
19
|
-
super(...arguments);
|
|
20
|
-
this.float = 'left';
|
|
21
|
-
}
|
|
22
|
-
render() {
|
|
23
|
-
return html `
|
|
24
|
-
<h3>BOTTOM</h3>
|
|
25
|
-
<span>click me</span>
|
|
26
|
-
<hy-tooltip
|
|
27
|
-
.isPopConfirm=${true}
|
|
28
|
-
.popConfirmDescription=${'Are you sure to delete this task?'}
|
|
29
|
-
.popConfirmTitle=${'delete the task'}
|
|
30
|
-
.cancelText=${'Cancel'}
|
|
31
|
-
.okText=${'Ok'}
|
|
32
|
-
@onCancel=${() => {
|
|
33
|
-
console.log('canceled');
|
|
34
|
-
}}
|
|
35
|
-
@onConfirm=${() => {
|
|
36
|
-
console.log('confirm');
|
|
37
|
-
}}
|
|
38
|
-
>
|
|
39
|
-
</hy-tooltip>
|
|
40
|
-
|
|
41
|
-
<br /><br /><br />
|
|
42
|
-
<p>hover me</p>
|
|
43
|
-
<hy-tooltip alignement=${'start'}>
|
|
44
|
-
<span>This is bottom and start</span>
|
|
45
|
-
</hy-tooltip>
|
|
46
|
-
|
|
47
|
-
<br /><br /><br />
|
|
48
|
-
<p>hover me</p>
|
|
49
|
-
<hy-tooltip alignement=${'end'}>
|
|
50
|
-
<span>This is bottom and end</span>
|
|
51
|
-
</hy-tooltip>
|
|
52
|
-
|
|
53
|
-
<br /><br /><br />
|
|
54
|
-
<h3>TOP</h3>
|
|
55
|
-
|
|
56
|
-
<p>hover me</p>
|
|
57
|
-
<hy-tooltip position=${'top'}>
|
|
58
|
-
<span>This is a description of the p in top and center</span>
|
|
59
|
-
</hy-tooltip>
|
|
60
|
-
<br /><br /><br />
|
|
61
|
-
<div>hover me</div>
|
|
62
|
-
|
|
63
|
-
<hy-tooltip position=${'top'} alignement=${'start'}>
|
|
64
|
-
<span>This is a description of the p in top and start </span>
|
|
65
|
-
</hy-tooltip>
|
|
66
|
-
<br /><br /><br />
|
|
67
|
-
|
|
68
|
-
<p>hover me</p>
|
|
69
|
-
|
|
70
|
-
<hy-tooltip position=${'top'} alignement=${'end'}>
|
|
71
|
-
<span>This is a description of the p in top and end</span>
|
|
72
|
-
</hy-tooltip>
|
|
73
|
-
<br /><br /><br />
|
|
74
|
-
<h3>RIGHT</h3>
|
|
75
|
-
<span>hover me</span>
|
|
76
|
-
<hy-tooltip position=${'right'}>
|
|
77
|
-
<span>This is a description of the p to the right and center</span>
|
|
78
|
-
</hy-tooltip>
|
|
79
|
-
|
|
80
|
-
<br /><br /><br />
|
|
81
|
-
|
|
82
|
-
<div>hover me</div>
|
|
83
|
-
<hy-tooltip position=${'right'} alignement=${'start'}>
|
|
84
|
-
<span>This is a description of the p to the right and start</span>
|
|
85
|
-
</hy-tooltip>
|
|
86
|
-
|
|
87
|
-
<br /><br /><br />
|
|
88
|
-
<span>hover me</span>
|
|
89
|
-
<hy-tooltip position=${'right'} alignement=${'end'}>
|
|
90
|
-
<span>This is a description of the p to the right and end</span>
|
|
91
|
-
</hy-tooltip>
|
|
92
|
-
|
|
93
|
-
<br /><br /><br />
|
|
94
|
-
<h3>LEFT</h3>
|
|
95
|
-
<span>hover me</span>
|
|
96
|
-
<hy-tooltip position=${'left'}>
|
|
97
|
-
<span>This is a description of the p to the left and center</span>
|
|
98
|
-
</hy-tooltip>
|
|
99
|
-
<br /><br /><br />
|
|
100
|
-
|
|
101
|
-
<span>hover me</span>
|
|
102
|
-
<hy-tooltip position=${'left'} alignement=${'start'}>
|
|
103
|
-
<span>This is a description of the p to the left and start</span>
|
|
104
|
-
</hy-tooltip>
|
|
105
|
-
|
|
106
|
-
<br /><br /><br />
|
|
107
|
-
|
|
108
|
-
<div>hover me</div>
|
|
109
|
-
<hy-tooltip position=${'left'} alignement=${'end'}>
|
|
110
|
-
<span>This is a description of the p to the left and end</span>
|
|
111
|
-
</hy-tooltip>
|
|
112
|
-
`;
|
|
113
|
-
}
|
|
114
|
-
};
|
|
115
|
-
ElMeenuElement.styles = [
|
|
116
|
-
css `
|
|
117
|
-
:host {
|
|
118
|
-
width: 800px;
|
|
119
|
-
display: flex;
|
|
120
|
-
flex-direction: column;
|
|
121
|
-
align-items: center;
|
|
122
|
-
}
|
|
123
|
-
`,
|
|
124
|
-
];
|
|
125
|
-
__decorate([
|
|
126
|
-
state()
|
|
127
|
-
], ElMeenuElement.prototype, "float", void 0);
|
|
128
|
-
ElMeenuElement = __decorate([
|
|
129
|
-
customElement('hy-tooltips-demo')
|
|
130
|
-
], ElMeenuElement);
|
|
131
|
-
export { ElMeenuElement };
|
|
132
|
-
//# sourceMappingURL=tooltips-demo.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips-demo.js","sourceRoot":"","sources":["../../../../src/components/tooltips/demo/tooltips-demo.ts"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,uDAAuD;AACvD;;;;GAIG;;;;;;;AAEH,OAAO,EAAC,UAAU,EAAE,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAC;AAC1C,OAAO,EAAC,aAAa,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAEvD,OAAO,uBAAuB,CAAC;AAG/B,IAAa,cAAc,GAA3B,MAAa,cAAe,SAAQ,UAAU;IAA9C;;QAEE,UAAK,GAAG,MAAM,CAAC;IAyGjB,CAAC;IAvGoB,MAAM;QACvB,OAAO,IAAI,CAAA;;;;wBAIS,IAAI;iCACK,mCAAmC;2BACzC,iBAAiB;sBACtB,QAAQ;kBACZ,IAAI;oBACF,GAAG,EAAE;YACf,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;QAC1B,CAAC;qBACY,GAAG,EAAE;YAChB,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;QACzB,CAAC;;;;;;+BAMsB,OAAO;;;;;;+BAMP,KAAK;;;;;;;;6BAQP,KAAK;;;;;;6BAML,KAAK,eAAe,OAAO;;;;;;;6BAO3B,KAAK,eAAe,KAAK;;;;;;6BAMzB,OAAO;;;;;;;6BAOP,OAAO,eAAe,OAAO;;;;;;6BAM7B,OAAO,eAAe,KAAK;;;;;;;6BAO3B,MAAM;;;;;;6BAMN,MAAM,eAAe,OAAO;;;;;;;6BAO5B,MAAM,eAAe,KAAK;;;KAGlD,CAAC;IACJ,CAAC;CAYF,CAAA;AAViB,qBAAM,GAAG;IACvB,GAAG,CAAA;;;;;;;KAOF;CACD,CAAA;AAxGF;IADC,KAAK,EAAE;6CACO;AAFJ,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CA2G1B;SA3GY,cAAc","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/no-explicit-any */\n/**\n * @license\n * Copyright 2023 Google Laabidi Aymen\n * SPDX-License-Identifier: MIT\n */\n\nimport {LitElement, css, html} from 'lit';\nimport {customElement, state} from 'lit/decorators.js';\n\nimport '../tooltips.component';\n\n@customElement('hy-tooltips-demo')\nexport class ElMeenuElement extends LitElement {\n @state()\n float = 'left';\n\n protected override render() {\n return html`\n <h3>BOTTOM</h3>\n <span>click me</span>\n <hy-tooltip\n .isPopConfirm=${true}\n .popConfirmDescription=${'Are you sure to delete this task?'}\n .popConfirmTitle=${'delete the task'}\n .cancelText=${'Cancel'}\n .okText=${'Ok'}\n @onCancel=${() => {\n console.log('canceled');\n }}\n @onConfirm=${() => {\n console.log('confirm');\n }}\n >\n </hy-tooltip>\n\n <br /><br /><br />\n <p>hover me</p>\n <hy-tooltip alignement=${'start'}>\n <span>This is bottom and start</span>\n </hy-tooltip>\n\n <br /><br /><br />\n <p>hover me</p>\n <hy-tooltip alignement=${'end'}>\n <span>This is bottom and end</span>\n </hy-tooltip>\n\n <br /><br /><br />\n <h3>TOP</h3>\n\n <p>hover me</p>\n <hy-tooltip position=${'top'}>\n <span>This is a description of the p in top and center</span>\n </hy-tooltip>\n <br /><br /><br />\n <div>hover me</div>\n\n <hy-tooltip position=${'top'} alignement=${'start'}>\n <span>This is a description of the p in top and start </span>\n </hy-tooltip>\n <br /><br /><br />\n\n <p>hover me</p>\n\n <hy-tooltip position=${'top'} alignement=${'end'}>\n <span>This is a description of the p in top and end</span>\n </hy-tooltip>\n <br /><br /><br />\n <h3>RIGHT</h3>\n <span>hover me</span>\n <hy-tooltip position=${'right'}>\n <span>This is a description of the p to the right and center</span>\n </hy-tooltip>\n\n <br /><br /><br />\n\n <div>hover me</div>\n <hy-tooltip position=${'right'} alignement=${'start'}>\n <span>This is a description of the p to the right and start</span>\n </hy-tooltip>\n\n <br /><br /><br />\n <span>hover me</span>\n <hy-tooltip position=${'right'} alignement=${'end'}>\n <span>This is a description of the p to the right and end</span>\n </hy-tooltip>\n\n <br /><br /><br />\n <h3>LEFT</h3>\n <span>hover me</span>\n <hy-tooltip position=${'left'}>\n <span>This is a description of the p to the left and center</span>\n </hy-tooltip>\n <br /><br /><br />\n\n <span>hover me</span>\n <hy-tooltip position=${'left'} alignement=${'start'}>\n <span>This is a description of the p to the left and start</span>\n </hy-tooltip>\n\n <br /><br /><br />\n\n <div>hover me</div>\n <hy-tooltip position=${'left'} alignement=${'end'}>\n <span>This is a description of the p to the left and end</span>\n </hy-tooltip>\n `;\n }\n\n static override styles = [\n css`\n :host {\n width: 800px;\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n `,\n ];\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hy-tooltips-demo': ElMeenuElement;\n }\n}\n"]}
|
package/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tooltips/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC"}
|
package/react.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../../../src/components/tooltips/react.ts"],"names":[],"mappings":""}
|
package/test/tooltips_test.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips_test.d.ts","sourceRoot":"","sources":["../../../../src/components/tooltips/test/tooltips_test.ts"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAC"}
|
package/test/tooltips_test.js
DELETED
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
2
|
-
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
3
|
-
return new (P || (P = Promise))(function (resolve, reject) {
|
|
4
|
-
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
5
|
-
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
6
|
-
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
7
|
-
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
|
-
import { html, fixture, expect } from '@open-wc/testing';
|
|
11
|
-
import '../tooltips.component';
|
|
12
|
-
import { TooltipAlignment, TooltipPosition } from '../tooltips.constant';
|
|
13
|
-
suite('TooltipElement', () => {
|
|
14
|
-
test('shows tooltip on mouseover and hides on mouseleave', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
15
|
-
const wrapper = yield fixture(html `
|
|
16
|
-
<div>
|
|
17
|
-
<span id="target">Hover me</span>
|
|
18
|
-
<hy-tooltip>Tooltip Content</hy-tooltip>
|
|
19
|
-
</div>
|
|
20
|
-
`);
|
|
21
|
-
const target = wrapper.querySelector('#target');
|
|
22
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
23
|
-
expect(tooltip.show).to.be.false;
|
|
24
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
25
|
-
expect(tooltip.show).to.be.true;
|
|
26
|
-
target.dispatchEvent(new MouseEvent('mouseleave'));
|
|
27
|
-
expect(tooltip.show).to.be.false;
|
|
28
|
-
}));
|
|
29
|
-
test('init tooltip position on mouseleave', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
30
|
-
const wrapper = yield fixture(html `
|
|
31
|
-
<div>
|
|
32
|
-
<span id="target">Hover me</span>
|
|
33
|
-
<hy-tooltip>Tooltip Content</hy-tooltip>
|
|
34
|
-
</div>
|
|
35
|
-
`);
|
|
36
|
-
const target = wrapper.querySelector('#target');
|
|
37
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
38
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
39
|
-
yield tooltip.updateComplete;
|
|
40
|
-
expect(tooltip.show).to.be.true;
|
|
41
|
-
expect(tooltip.style.top).to.not.be.empty;
|
|
42
|
-
expect(tooltip.style.left).to.not.be.empty;
|
|
43
|
-
expect(tooltip.style.width).to.not.be.empty;
|
|
44
|
-
target.dispatchEvent(new MouseEvent('mouseleave'));
|
|
45
|
-
expect(tooltip.show).to.be.false;
|
|
46
|
-
expect(tooltip.style.top).to.be.empty;
|
|
47
|
-
expect(tooltip.style.left).to.be.empty;
|
|
48
|
-
expect(tooltip.style.width).to.be.empty;
|
|
49
|
-
}));
|
|
50
|
-
suite('calculates tooltip style correctly', () => {
|
|
51
|
-
test('tooltip style when position is bottom and alignement is center', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
52
|
-
const wrapper = yield fixture(html `
|
|
53
|
-
<div>
|
|
54
|
-
<span id="target">Hover me</span>
|
|
55
|
-
<hy-tooltip position="${TooltipPosition.Bottom}" alignement="${TooltipAlignment.Center}">
|
|
56
|
-
Tooltip Content
|
|
57
|
-
</hy-tooltip>
|
|
58
|
-
</div>
|
|
59
|
-
`);
|
|
60
|
-
const target = wrapper.querySelector('#target');
|
|
61
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
62
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
63
|
-
yield tooltip.updateComplete;
|
|
64
|
-
const targetRect = target.getBoundingClientRect();
|
|
65
|
-
const tooltipRect = tooltip.getBoundingClientRect();
|
|
66
|
-
expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.bottom + tooltip.verticalOffset));
|
|
67
|
-
expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(Math.ceil(targetRect.left - tooltipRect.width / 2 + targetRect.width / 2));
|
|
68
|
-
}));
|
|
69
|
-
test('tooltip style when position is left and alignement is end', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
70
|
-
const wrapper = yield fixture(html `
|
|
71
|
-
<div>
|
|
72
|
-
<span id="target">Hover me</span>
|
|
73
|
-
<hy-tooltip position="${TooltipPosition.Left}" alignement="${TooltipAlignment.End}">
|
|
74
|
-
Tooltip Content
|
|
75
|
-
</hy-tooltip>
|
|
76
|
-
</div>
|
|
77
|
-
`);
|
|
78
|
-
const target = wrapper.querySelector('#target');
|
|
79
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
80
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
81
|
-
yield tooltip.updateComplete;
|
|
82
|
-
const targetRect = target.getBoundingClientRect();
|
|
83
|
-
const tooltipRect = tooltip.getBoundingClientRect();
|
|
84
|
-
expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.bottom - tooltipRect.height));
|
|
85
|
-
expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(Math.ceil(targetRect.left - tooltipRect.width - tooltip.horizontalOffset));
|
|
86
|
-
}));
|
|
87
|
-
test('tooltip style when position is top and alignement is start', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
88
|
-
const wrapper = yield fixture(html `
|
|
89
|
-
<div>
|
|
90
|
-
<span id="target">Hover me</span>
|
|
91
|
-
<hy-tooltip position="${TooltipPosition.Top}" alignement="${TooltipAlignment.Start}">
|
|
92
|
-
Tooltip Content
|
|
93
|
-
</hy-tooltip>
|
|
94
|
-
</div>
|
|
95
|
-
`);
|
|
96
|
-
const target = wrapper.querySelector('#target');
|
|
97
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
98
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
99
|
-
yield tooltip.updateComplete;
|
|
100
|
-
const targetRect = target.getBoundingClientRect();
|
|
101
|
-
const tooltipRect = tooltip.getBoundingClientRect();
|
|
102
|
-
expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.top - tooltipRect.height - tooltip.verticalOffset));
|
|
103
|
-
expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(Math.ceil(targetRect.left - tooltip.horizontalOffset));
|
|
104
|
-
}));
|
|
105
|
-
});
|
|
106
|
-
suite('removes event listeners on disconnectedCallback', () => {
|
|
107
|
-
test('removes mouseleave listener', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
108
|
-
const wrapper = yield fixture(html `
|
|
109
|
-
<div>
|
|
110
|
-
<span id="target">Hover me</span>
|
|
111
|
-
<hy-tooltip>Tooltip Content</hy-tooltip>
|
|
112
|
-
</div>
|
|
113
|
-
`);
|
|
114
|
-
const target = wrapper.querySelector('#target');
|
|
115
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
116
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
117
|
-
expect(tooltip.show).to.be.true;
|
|
118
|
-
target.dispatchEvent(new MouseEvent('mouseleave'));
|
|
119
|
-
expect(tooltip.show).to.be.false;
|
|
120
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
121
|
-
expect(tooltip.show).to.be.true;
|
|
122
|
-
wrapper.removeChild(tooltip);
|
|
123
|
-
target.dispatchEvent(new MouseEvent('mouseleave'));
|
|
124
|
-
expect(tooltip.show).to.be.true;
|
|
125
|
-
}));
|
|
126
|
-
test('removes mouseover listener', () => __awaiter(void 0, void 0, void 0, function* () {
|
|
127
|
-
const wrapper = yield fixture(html `
|
|
128
|
-
<div>
|
|
129
|
-
<span id="target">Hover me</span>
|
|
130
|
-
<hy-tooltip>Tooltip Content</hy-tooltip>
|
|
131
|
-
</div>
|
|
132
|
-
`);
|
|
133
|
-
const target = wrapper.querySelector('#target');
|
|
134
|
-
const tooltip = wrapper.querySelector('hy-tooltip');
|
|
135
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
136
|
-
expect(tooltip.show).to.be.true;
|
|
137
|
-
target.dispatchEvent(new MouseEvent('mouseleave'));
|
|
138
|
-
expect(tooltip.show).to.be.false;
|
|
139
|
-
wrapper.removeChild(tooltip);
|
|
140
|
-
target.dispatchEvent(new MouseEvent('mouseover'));
|
|
141
|
-
expect(tooltip.show).to.be.false;
|
|
142
|
-
}));
|
|
143
|
-
});
|
|
144
|
-
});
|
|
145
|
-
//# sourceMappingURL=tooltips_test.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips_test.js","sourceRoot":"","sources":["../../../../src/components/tooltips/test/tooltips_test.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, fixture, expect} from '@open-wc/testing';\nimport '../tooltips.component';\nimport {TooltipElement} from '../tooltips.component';\nimport {TooltipAlignment, TooltipPosition} from '../tooltips.constant';\nsuite('TooltipElement', () => {\n test('shows tooltip on mouseover and hides on mouseleave', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip>Tooltip Content</hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n\n expect(tooltip.show).to.be.false;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n expect(tooltip.show).to.be.true;\n\n target.dispatchEvent(new MouseEvent('mouseleave'));\n expect(tooltip.show).to.be.false;\n });\n\n test('init tooltip position on mouseleave', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip>Tooltip Content</hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n target.dispatchEvent(new MouseEvent('mouseover'));\n await tooltip.updateComplete;\n expect(tooltip.show).to.be.true;\n expect(tooltip.style.top).to.not.be.empty;\n expect(tooltip.style.left).to.not.be.empty;\n expect(tooltip.style.width).to.not.be.empty;\n\n target.dispatchEvent(new MouseEvent('mouseleave'));\n expect(tooltip.show).to.be.false;\n expect(tooltip.style.top).to.be.empty;\n expect(tooltip.style.left).to.be.empty;\n expect(tooltip.style.width).to.be.empty;\n });\n\n suite('calculates tooltip style correctly', () => {\n test('tooltip style when position is bottom and alignement is center', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip position=\"${TooltipPosition.Bottom}\" alignement=\"${TooltipAlignment.Center}\">\n Tooltip Content\n </hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n\n await tooltip.updateComplete;\n\n const targetRect = target.getBoundingClientRect();\n const tooltipRect = tooltip.getBoundingClientRect();\n\n expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(\n Math.ceil(targetRect.bottom + tooltip.verticalOffset)\n );\n expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(\n Math.ceil(targetRect.left - tooltipRect.width / 2 + targetRect.width / 2)\n );\n });\n\n test('tooltip style when position is left and alignement is end', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip position=\"${TooltipPosition.Left}\" alignement=\"${TooltipAlignment.End}\">\n Tooltip Content\n </hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n\n await tooltip.updateComplete;\n\n const targetRect = target.getBoundingClientRect();\n const tooltipRect = tooltip.getBoundingClientRect();\n\n expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(Math.ceil(targetRect.bottom - tooltipRect.height));\n expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(\n Math.ceil(targetRect.left - tooltipRect.width - tooltip.horizontalOffset)\n );\n });\n\n test('tooltip style when position is top and alignement is start', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip position=\"${TooltipPosition.Top}\" alignement=\"${TooltipAlignment.Start}\">\n Tooltip Content\n </hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n\n await tooltip.updateComplete;\n\n const targetRect = target.getBoundingClientRect();\n const tooltipRect = tooltip.getBoundingClientRect();\n\n expect(Math.ceil(+tooltip.style.top.split('px')[0])).to.equal(\n Math.ceil(targetRect.top - tooltipRect.height - tooltip.verticalOffset)\n );\n expect(Math.ceil(+tooltip.style.left.split('px')[0])).to.equal(\n Math.ceil(targetRect.left - tooltip.horizontalOffset)\n );\n });\n });\n\n suite('removes event listeners on disconnectedCallback', () => {\n test('removes mouseleave listener', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip>Tooltip Content</hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n expect(tooltip.show).to.be.true;\n\n target.dispatchEvent(new MouseEvent('mouseleave'));\n expect(tooltip.show).to.be.false;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n expect(tooltip.show).to.be.true;\n\n wrapper.removeChild(tooltip);\n target.dispatchEvent(new MouseEvent('mouseleave'));\n expect(tooltip.show).to.be.true;\n });\n\n test('removes mouseover listener', async () => {\n const wrapper = await fixture(html`\n <div>\n <span id=\"target\">Hover me</span>\n <hy-tooltip>Tooltip Content</hy-tooltip>\n </div>\n `);\n const target = wrapper.querySelector('#target')!;\n const tooltip: TooltipElement = wrapper.querySelector('hy-tooltip')!;\n\n target.dispatchEvent(new MouseEvent('mouseover'));\n expect(tooltip.show).to.be.true;\n\n target.dispatchEvent(new MouseEvent('mouseleave'));\n expect(tooltip.show).to.be.false;\n\n wrapper.removeChild(tooltip);\n target.dispatchEvent(new MouseEvent('mouseover'));\n expect(tooltip.show).to.be.false;\n });\n });\n});\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips.component.d.ts","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,UAAU,EAAE,OAAO,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AAGlE,OAAO,EAAgB,gBAAgB,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzF,qBACa,cAAe,SAAQ,UAAU;IAC5C,OAAgB,MAAM,4BAAU;IAGhC,QAAQ,kBAA0B;IAGlC,UAAU,mBAA2B;IAGrC,MAAM,EAAG,OAAO,CAAC;IAEjB,IAAI,UAAS;IAEb,YAAY,UAAS;IAErB,eAAe,SAAM;IAErB,qBAAqB,SAAM;IAE3B,MAAM,SAAS;IAEf,UAAU,SAAQ;IAElB,gBAAgB,SAAM;IACtB,cAAc,SAAM;IACX,iBAAiB,IAAI,IAAI;IAqBlC,OAAO,CAAC,WAAW,CAEjB;IAEF,OAAO,CAAC,YAAY,CAGlB;IAEF,OAAO,CAAC,OAAO,CAEb;IAEF,OAAO,CAAC,UAAU;IAOT,OAAO,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC,GAAG,IAAI;IAI7F,OAAO,CAAC,iBAAiB,CAWvB;IACF,OAAO,CAAC,kBAAkB,CA0BxB;IACF,OAAO,CAAC,oBAAoB,CA4C1B;IACF,OAAO,CAAC,kBAAkB,CA0BxB;IACF,OAAO,CAAC,oBAAoB,CA2C1B;IAEF,kBAAkB;IAKlB,mBAAmB;IAKnB,cAAc,iBAAkB,KAAK,UAInC;IACO,oBAAoB,IAAI,IAAI;IAW5B,MAAM;CAsBhB"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips.constant.d.ts","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.constant.ts"],"names":[],"mappings":"AAAA,oBAAY,eAAe;IACzB,GAAG,QAAQ;IACX,MAAM,WAAW;IACjB,KAAK,UAAU;IACf,IAAI,SAAS;CACd;AAED,oBAAY,gBAAgB;IAC1B,KAAK,UAAU;IACf,MAAM,WAAW;IACjB,GAAG,QAAQ;CACZ;AAGD,eAAO,MAAM,YAAY,KAAK,CAAC"}
|
package/tooltips.style.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips.style.d.ts","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.style.ts"],"names":[],"mappings":"AAsGA,eAAO,MAAM,MAAM,2BAAkC,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltips.variables.d.ts","sourceRoot":"","sources":["../../../src/components/tooltips/tooltips.variables.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAW1B,CAAC"}
|