fleetcor-lwc 1.4.1 → 1.4.3
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/README.md
CHANGED
|
@@ -129,6 +129,16 @@ $FLT_BUTTON_LINK_HOVER_COLOR: var(--flt-button-link-hover-color, #6b7280);
|
|
|
129
129
|
|
|
130
130
|
## Release Notes:
|
|
131
131
|
|
|
132
|
+
- v.1.4.3
|
|
133
|
+
- Bug fix at tooltip corner attribute
|
|
134
|
+
|
|
135
|
+
---
|
|
136
|
+
|
|
137
|
+
- v.1.4.2
|
|
138
|
+
- Bug fix selectors conflicts
|
|
139
|
+
|
|
140
|
+
---
|
|
141
|
+
|
|
132
142
|
- v.1.4.1
|
|
133
143
|
- Bug fix with empty content and svg max width
|
|
134
144
|
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
<template lwc:render-mode="light">
|
|
2
|
-
<div class="tooltip" onmouseover={over} ontouchstart={over} onmouseout={out} ontouchend={out}>
|
|
2
|
+
<div class="flt-tooltip" onmouseover={over} ontouchstart={over} onmouseout={out} ontouchend={out}>
|
|
3
3
|
<slot></slot>
|
|
4
4
|
<div if:true={content} class={tooltipVisibility} style={conentStyle}>
|
|
5
|
-
<svg class="tooltip__svg" height={svgH} width={svgW} style={svgStyle}>
|
|
6
|
-
<path class="tooltip__path" d={svgD}></path>
|
|
5
|
+
<svg class="flt-tooltip__svg" height={svgH} width={svgW} style={svgStyle}>
|
|
6
|
+
<path class="flt-tooltip__path" d={svgD}></path>
|
|
7
7
|
</svg>
|
|
8
|
-
<p class="tooltip__text" style={textStyle}></p>
|
|
8
|
+
<p class="flt-tooltip__text" style={textStyle}></p>
|
|
9
9
|
</div>
|
|
10
10
|
</div>
|
|
11
11
|
</template>
|
|
@@ -56,7 +56,9 @@ export default class Tooltip extends LightningElement {
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
get tooltipVisibility() {
|
|
59
|
-
return this.active
|
|
59
|
+
return this.active
|
|
60
|
+
? 'flt-tooltip__content flt-tooltip__content_visible'
|
|
61
|
+
: 'flt-tooltip__content'
|
|
60
62
|
}
|
|
61
63
|
|
|
62
64
|
get svgD() {
|
|
@@ -201,13 +203,14 @@ export default class Tooltip extends LightningElement {
|
|
|
201
203
|
|
|
202
204
|
connectedCallback() {
|
|
203
205
|
if (this.content) {
|
|
206
|
+
this.corner = parseInt(this.corner)
|
|
204
207
|
this.resizeObserver = new ResizeObserver(this.update.bind(this))
|
|
205
208
|
}
|
|
206
209
|
}
|
|
207
210
|
|
|
208
211
|
update() {
|
|
209
212
|
if (this.content) {
|
|
210
|
-
const text = this.firstChild.querySelector('.tooltip__text')
|
|
213
|
+
const text = this.firstChild.querySelector('.flt-tooltip__text')
|
|
211
214
|
text.innerHTML = this.content
|
|
212
215
|
this.createTooltip()
|
|
213
216
|
}
|
|
@@ -232,7 +235,7 @@ export default class Tooltip extends LightningElement {
|
|
|
232
235
|
|
|
233
236
|
createTooltip() {
|
|
234
237
|
// 1. find width of tooltip
|
|
235
|
-
const text = this.firstChild.querySelector('.tooltip__text')
|
|
238
|
+
const text = this.firstChild.querySelector('.flt-tooltip__text')
|
|
236
239
|
this.minimalWidth = getLineWidth(text)
|
|
237
240
|
if (this.minimalWidth < this.maxWidth) {
|
|
238
241
|
this.minimalWidth = this.minimalWidth + this.paddingX * 2 + 2 * this.delta
|