carbon-components-angular 5.24.2 → 5.24.3

package/docs/documentation/components/Tooltip.html

@@ -165,6 +165,10 @@
                 <tr>
                     <td class="col-md-4">
                         <ul class="index-list">
+                            <li>
+                                    <span class="modifier">Private</span>
+                                <a href="#timeoutId" >timeoutId</a>
+                            </li>
                             <li>
                                     <span class="modifier"></span>
                                 <a href="#tooltipClass" >tooltipClass</a>
@@ -406,7 +410,7 @@
                 </tr>
                         <tr>
                             <td class="col-md-4">
-                                <div class="io-line">Defined in <a href="" data-line="77" class="link-to-prism">src/tooltip/tooltip.component.ts:77</a></div>
+                                <div class="io-line">Defined in <a href="" data-line="79" class="link-to-prism">src/tooltip/tooltip.component.ts:79</a></div>
                             </td>
                         </tr>
 
@@ -1088,8 +1092,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="114"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:114</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="122"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:122</a></div>
                 </td>
             </tr>
 
@@ -1121,8 +1125,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="119"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:119</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="127"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:127</a></div>
                 </td>
             </tr>
 
@@ -1154,8 +1158,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="105"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:105</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="113"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:113</a></div>
                 </td>
             </tr>
 
@@ -1187,8 +1191,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="91"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:91</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="93"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:93</a></div>
                 </td>
             </tr>
 
@@ -1220,8 +1224,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="98"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:98</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="103"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:103</a></div>
                 </td>
             </tr>
 
@@ -1263,8 +1267,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="114"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:114</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="122"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:122</a></div>
                 </td>
             </tr>
 
@@ -1341,8 +1345,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="119"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:119</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="127"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:127</a></div>
                 </td>
             </tr>
 
@@ -1419,8 +1423,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="105"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:105</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="113"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:113</a></div>
                 </td>
             </tr>
 
@@ -1488,8 +1492,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="123"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:123</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="131"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:131</a></div>
                 </td>
             </tr>
 
@@ -1562,8 +1566,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="91"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:91</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="93"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:93</a></div>
                 </td>
             </tr>
 
@@ -1636,8 +1640,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="98"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:98</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="103"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:103</a></div>
                 </td>
             </tr>
 
@@ -1701,8 +1705,8 @@ This is not toggleable - should be assigned once</p>
 
             <tr>
                 <td class="col-md-4">
-                    <div class="io-line">Defined in <a href="" data-line="130"
-                            class="link-to-prism">src/tooltip/tooltip.component.ts:130</a></div>
+                    <div class="io-line">Defined in <a href="" data-line="138"
+                            class="link-to-prism">src/tooltip/tooltip.component.ts:138</a></div>
                 </td>
             </tr>
 
@@ -2288,6 +2292,33 @@ This is not toggleable - should be assigned once</p>
     <h3 id="inputs">
         Properties
     </h3>
+    <table class="table table-sm table-bordered">
+        <tbody>
+            <tr>
+                <td class="col-md-4">
+                    <a name="timeoutId"></a>
+                    <span class="name">
+                            <span class="modifier">Private</span>
+                        <span ><b>timeoutId</b></span>
+                        <a href="#timeoutId"><span class="icon ion-ios-link"></span></a>
+                    </span>
+                </td>
+            </tr>
+                <tr>
+                    <td class="col-md-4">
+                        <i>Type : </i>        <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >any</a></code>
+
+                    </td>
+                </tr>
+                    <tr>
+                        <td class="col-md-4">
+                                <div class="io-line">Defined in <a href="" data-line="79" class="link-to-prism">src/tooltip/tooltip.component.ts:79</a></div>
+                        </td>
+                    </tr>
+
+
+        </tbody>
+    </table>
     <table class="table table-sm table-bordered">
         <tbody>
             <tr>
@@ -2760,10 +2791,12 @@ export class Tooltip extends PopoverContainer implements AfterContentChecked {
 	/**
 	 * Optional data for templates passed as implicit context
 	 */
-	@Input() templateContext: any
+	@Input() templateContext: any;
 
 	@ViewChild(&quot;contentWrapper&quot;) wrapper: ElementRef&lt;HTMLSpanElement&gt;;
 
+	private timeoutId: any; // it should be number, but setTimeout below is matching the NodeJs type instead of the JS type
+
 	constructor(
 		protected elementRef: ElementRef,
 		protected ngZone: NgZone,
@@ -2777,14 +2810,20 @@ export class Tooltip extends PopoverContainer implements AfterContentChecked {
 
 	@HostListener(&quot;mouseenter&quot;, [&quot;$event&quot;])
 	mouseenter(event) {
-		setTimeout(() &#x3D;&gt; {
+		// If a mouseleave is triggered before the tooltip is displayed (before setTimeout of mouseenter completes)
+		// we trigger the mouseleave only avoiding having to unecessary show the tooltip
+		clearTimeout(this.timeoutId);
+		this.timeoutId &#x3D; setTimeout(() &#x3D;&gt; {
 			this.handleChange(true, event);
 		}, this.enterDelayMs);
 	}
 
 	@HostListener(&quot;mouseleave&quot;, [&quot;$event&quot;])
 	mouseleave(event) {
-		setTimeout(() &#x3D;&gt; {
+		// If a mouseleave is triggered before the tooltip is displayed (before setTimeout of mouseenter completes)
+		// we trigger the mouseleave only avoiding having to unecessary show the tooltip
+		clearTimeout(this.timeoutId);
+		this.timeoutId &#x3D; setTimeout(() &#x3D;&gt; {
 			this.handleChange(false, event);
 		}, this.leaveDelayMs);
 	}

package/docs/documentation/coverage.html

@@ -2846,9 +2846,9 @@
             </td>
             <td>component</td>
             <td>Tooltip</td>
-            <td align="right" data-sort="43">
-                <span class="coverage-percent">43 %</span>
-                <span class="coverage-count">(22/51)</span>
+            <td align="right" data-sort="42">
+                <span class="coverage-percent">42 %</span>
+                <span class="coverage-count">(22/52)</span>
             </td>
         </tr>
         <tr class="very-good">