carbon-components-angular 5.2.0 → 5.2.2
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/bundles/carbon-components-angular-table.umd.js +30 -19
- package/bundles/carbon-components-angular-table.umd.js.map +1 -1
- package/bundles/carbon-components-angular-tooltip.umd.js +16 -2
- package/bundles/carbon-components-angular-tooltip.umd.js.map +1 -1
- package/docs/documentation/components/Tooltip.html +143 -47
- package/docs/documentation/coverage.html +6 -6
- package/docs/documentation/directives/TableDirective.html +143 -39
- package/docs/documentation/interfaces/TableTranslations.html +1 -1
- package/docs/documentation/js/search/search_index.js +2 -2
- package/docs/documentation/miscellaneous/typealiases.html +1 -1
- package/docs/documentation.json +103 -54
- package/docs/storybook/iframe.html +1 -1
- package/docs/storybook/{main.2485e7a7.iframe.bundle.js → main.6ced09a7.iframe.bundle.js} +54 -31
- package/docs/storybook/main.6ced09a7.iframe.bundle.js.map +1 -0
- package/docs/storybook/project.json +1 -1
- package/esm2015/table/table.directive.js +20 -17
- package/esm2015/table/table.types.js +1 -1
- package/esm2015/tooltip/tooltip.component.js +21 -11
- package/fesm2015/carbon-components-angular-table.js +19 -16
- package/fesm2015/carbon-components-angular-table.js.map +1 -1
- package/fesm2015/carbon-components-angular-tooltip.js +20 -10
- package/fesm2015/carbon-components-angular-tooltip.js.map +1 -1
- package/package.json +1 -1
- package/table/table.directive.d.ts +5 -3
- package/table/table.types.d.ts +1 -1
- package/tooltip/tooltip.component.d.ts +7 -2
- package/docs/storybook/main.2485e7a7.iframe.bundle.js.map +0 -1
|
@@ -77,6 +77,12 @@
|
|
|
77
77
|
<code><a href="../directives/PopoverContainer.html" target="_self" >PopoverContainer</a></code>
|
|
78
78
|
</p>
|
|
79
79
|
|
|
80
|
+
<p class="comment">
|
|
81
|
+
<h3>Implements</h3>
|
|
82
|
+
</p>
|
|
83
|
+
<p class="comment">
|
|
84
|
+
<code><a href="https://angular.io/api/core/AfterContentChecked" target="_blank" >AfterContentChecked</a></code>
|
|
85
|
+
</p>
|
|
80
86
|
|
|
81
87
|
|
|
82
88
|
<section>
|
|
@@ -103,16 +109,14 @@
|
|
|
103
109
|
|
|
104
110
|
<tr>
|
|
105
111
|
<td class="col-md-3">template</td>
|
|
106
|
-
<td class="col-md-9"><pre class="line-numbers"><code class="language-html"><span
|
|
107
|
-
[attr.aria-labelledby]="this.isTemplate(this.description) ? id : null"
|
|
108
|
-
[attr.aria-describedby]="!this.isTemplate(this.description) ? id : null">
|
|
112
|
+
<td class="col-md-9"><pre class="line-numbers"><code class="language-html"><span #contentWrapper>
|
|
109
113
|
<ng-content></ng-content>
|
|
110
114
|
</span>
|
|
111
115
|
<span
|
|
112
116
|
*ngIf="description"
|
|
113
117
|
class="cds--popover"
|
|
114
118
|
[id]="id"
|
|
115
|
-
[attr.aria-hidden]="
|
|
119
|
+
[attr.aria-hidden]="!isOpen"
|
|
116
120
|
role="tooltip">
|
|
117
121
|
<ng-container *ngIf="!disabled">
|
|
118
122
|
<span class="cds--popover-content cds--tooltip-content">
|
|
@@ -156,6 +160,9 @@
|
|
|
156
160
|
<span class="modifier">Static</span>
|
|
157
161
|
<a href="#tooltipCount" >tooltipCount</a>
|
|
158
162
|
</li>
|
|
163
|
+
<li>
|
|
164
|
+
<a href="#wrapper" >wrapper</a>
|
|
165
|
+
</li>
|
|
159
166
|
<li>
|
|
160
167
|
<a href="#containerClass" >containerClass</a>
|
|
161
168
|
</li>
|
|
@@ -181,7 +188,6 @@
|
|
|
181
188
|
<a href="#hostkeys" >hostkeys</a>
|
|
182
189
|
</li>
|
|
183
190
|
<li>
|
|
184
|
-
<span class="modifier">Public</span>
|
|
185
191
|
<a href="#isTemplate" >isTemplate</a>
|
|
186
192
|
</li>
|
|
187
193
|
<li>
|
|
@@ -190,6 +196,9 @@
|
|
|
190
196
|
<li>
|
|
191
197
|
<a href="#mouseleave" >mouseleave</a>
|
|
192
198
|
</li>
|
|
199
|
+
<li>
|
|
200
|
+
<a href="#ngAfterContentChecked" >ngAfterContentChecked</a>
|
|
201
|
+
</li>
|
|
193
202
|
<li>
|
|
194
203
|
<a href="#handleChange" >handleChange</a>
|
|
195
204
|
</li>
|
|
@@ -356,7 +365,7 @@
|
|
|
356
365
|
</tr>
|
|
357
366
|
<tr>
|
|
358
367
|
<td class="col-md-4">
|
|
359
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
368
|
+
<div class="io-line">Defined in <a href="" data-line="61" class="link-to-prism">src/tooltip/tooltip.component.ts:61</a></div>
|
|
360
369
|
</td>
|
|
361
370
|
</tr>
|
|
362
371
|
|
|
@@ -382,7 +391,7 @@
|
|
|
382
391
|
</tr>
|
|
383
392
|
<tr>
|
|
384
393
|
<td class="col-md-2" colspan="2">
|
|
385
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
394
|
+
<div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/tooltip/tooltip.component.ts:59</a></div>
|
|
386
395
|
</td>
|
|
387
396
|
</tr>
|
|
388
397
|
<tr>
|
|
@@ -414,7 +423,7 @@
|
|
|
414
423
|
</tr>
|
|
415
424
|
<tr>
|
|
416
425
|
<td class="col-md-2" colspan="2">
|
|
417
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
426
|
+
<div class="io-line">Defined in <a href="" data-line="55" class="link-to-prism">src/tooltip/tooltip.component.ts:55</a></div>
|
|
418
427
|
</td>
|
|
419
428
|
</tr>
|
|
420
429
|
<tr>
|
|
@@ -446,7 +455,7 @@
|
|
|
446
455
|
</tr>
|
|
447
456
|
<tr>
|
|
448
457
|
<td class="col-md-2" colspan="2">
|
|
449
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
458
|
+
<div class="io-line">Defined in <a href="" data-line="47" class="link-to-prism">src/tooltip/tooltip.component.ts:47</a></div>
|
|
450
459
|
</td>
|
|
451
460
|
</tr>
|
|
452
461
|
<tr>
|
|
@@ -478,7 +487,7 @@
|
|
|
478
487
|
</tr>
|
|
479
488
|
<tr>
|
|
480
489
|
<td class="col-md-2" colspan="2">
|
|
481
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
490
|
+
<div class="io-line">Defined in <a href="" data-line="43" class="link-to-prism">src/tooltip/tooltip.component.ts:43</a></div>
|
|
482
491
|
</td>
|
|
483
492
|
</tr>
|
|
484
493
|
</tbody>
|
|
@@ -504,7 +513,7 @@
|
|
|
504
513
|
</tr>
|
|
505
514
|
<tr>
|
|
506
515
|
<td class="col-md-2" colspan="2">
|
|
507
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
516
|
+
<div class="io-line">Defined in <a href="" data-line="51" class="link-to-prism">src/tooltip/tooltip.component.ts:51</a></div>
|
|
508
517
|
</td>
|
|
509
518
|
</tr>
|
|
510
519
|
<tr>
|
|
@@ -811,7 +820,7 @@
|
|
|
811
820
|
</tr>
|
|
812
821
|
<tr>
|
|
813
822
|
<td class="col-md-4">
|
|
814
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
823
|
+
<div class="io-line">Defined in <a href="" data-line="41" class="link-to-prism">src/tooltip/tooltip.component.ts:41</a></div>
|
|
815
824
|
</td>
|
|
816
825
|
</tr>
|
|
817
826
|
|
|
@@ -1280,8 +1289,8 @@
|
|
|
1280
1289
|
|
|
1281
1290
|
<tr>
|
|
1282
1291
|
<td class="col-md-4">
|
|
1283
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1284
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1292
|
+
<div class="io-line">Defined in <a href="" data-line="93"
|
|
1293
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:93</a></div>
|
|
1285
1294
|
</td>
|
|
1286
1295
|
</tr>
|
|
1287
1296
|
|
|
@@ -1313,8 +1322,8 @@
|
|
|
1313
1322
|
|
|
1314
1323
|
<tr>
|
|
1315
1324
|
<td class="col-md-4">
|
|
1316
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1317
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1325
|
+
<div class="io-line">Defined in <a href="" data-line="98"
|
|
1326
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:98</a></div>
|
|
1318
1327
|
</td>
|
|
1319
1328
|
</tr>
|
|
1320
1329
|
|
|
@@ -1346,8 +1355,8 @@
|
|
|
1346
1355
|
|
|
1347
1356
|
<tr>
|
|
1348
1357
|
<td class="col-md-4">
|
|
1349
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1350
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1358
|
+
<div class="io-line">Defined in <a href="" data-line="84"
|
|
1359
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:84</a></div>
|
|
1351
1360
|
</td>
|
|
1352
1361
|
</tr>
|
|
1353
1362
|
|
|
@@ -1379,8 +1388,8 @@
|
|
|
1379
1388
|
|
|
1380
1389
|
<tr>
|
|
1381
1390
|
<td class="col-md-4">
|
|
1382
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1383
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1391
|
+
<div class="io-line">Defined in <a href="" data-line="70"
|
|
1392
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:70</a></div>
|
|
1384
1393
|
</td>
|
|
1385
1394
|
</tr>
|
|
1386
1395
|
|
|
@@ -1412,8 +1421,8 @@
|
|
|
1412
1421
|
|
|
1413
1422
|
<tr>
|
|
1414
1423
|
<td class="col-md-4">
|
|
1415
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1416
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1424
|
+
<div class="io-line">Defined in <a href="" data-line="77"
|
|
1425
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:77</a></div>
|
|
1417
1426
|
</td>
|
|
1418
1427
|
</tr>
|
|
1419
1428
|
|
|
@@ -1453,8 +1462,8 @@
|
|
|
1453
1462
|
|
|
1454
1463
|
<tr>
|
|
1455
1464
|
<td class="col-md-4">
|
|
1456
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1457
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1465
|
+
<div class="io-line">Defined in <a href="" data-line="93"
|
|
1466
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:93</a></div>
|
|
1458
1467
|
</td>
|
|
1459
1468
|
</tr>
|
|
1460
1469
|
|
|
@@ -1529,8 +1538,8 @@
|
|
|
1529
1538
|
|
|
1530
1539
|
<tr>
|
|
1531
1540
|
<td class="col-md-4">
|
|
1532
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1533
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1541
|
+
<div class="io-line">Defined in <a href="" data-line="98"
|
|
1542
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:98</a></div>
|
|
1534
1543
|
</td>
|
|
1535
1544
|
</tr>
|
|
1536
1545
|
|
|
@@ -1605,8 +1614,8 @@
|
|
|
1605
1614
|
|
|
1606
1615
|
<tr>
|
|
1607
1616
|
<td class="col-md-4">
|
|
1608
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1609
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1617
|
+
<div class="io-line">Defined in <a href="" data-line="84"
|
|
1618
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:84</a></div>
|
|
1610
1619
|
</td>
|
|
1611
1620
|
</tr>
|
|
1612
1621
|
|
|
@@ -1660,7 +1669,6 @@
|
|
|
1660
1669
|
<td class="col-md-4">
|
|
1661
1670
|
<a name="isTemplate"></a>
|
|
1662
1671
|
<span class="name">
|
|
1663
|
-
<span class="modifier">Public</span>
|
|
1664
1672
|
<span ><b>isTemplate</b></span>
|
|
1665
1673
|
<a href="#isTemplate"><span class="icon ion-ios-link"></span></a>
|
|
1666
1674
|
</span>
|
|
@@ -1668,16 +1676,15 @@
|
|
|
1668
1676
|
</tr>
|
|
1669
1677
|
<tr>
|
|
1670
1678
|
<td class="col-md-4">
|
|
1671
|
-
|
|
1672
|
-
<code>isTemplate(value)</code>
|
|
1679
|
+
<code>isTemplate(value)</code>
|
|
1673
1680
|
</td>
|
|
1674
1681
|
</tr>
|
|
1675
1682
|
|
|
1676
1683
|
|
|
1677
1684
|
<tr>
|
|
1678
1685
|
<td class="col-md-4">
|
|
1679
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1680
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1686
|
+
<div class="io-line">Defined in <a href="" data-line="102"
|
|
1687
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:102</a></div>
|
|
1681
1688
|
</td>
|
|
1682
1689
|
</tr>
|
|
1683
1690
|
|
|
@@ -1748,8 +1755,8 @@
|
|
|
1748
1755
|
|
|
1749
1756
|
<tr>
|
|
1750
1757
|
<td class="col-md-4">
|
|
1751
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1752
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1758
|
+
<div class="io-line">Defined in <a href="" data-line="70"
|
|
1759
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:70</a></div>
|
|
1753
1760
|
</td>
|
|
1754
1761
|
</tr>
|
|
1755
1762
|
|
|
@@ -1820,8 +1827,8 @@
|
|
|
1820
1827
|
|
|
1821
1828
|
<tr>
|
|
1822
1829
|
<td class="col-md-4">
|
|
1823
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
1824
|
-
class="link-to-prism">src/tooltip/tooltip.component.ts:
|
|
1830
|
+
<div class="io-line">Defined in <a href="" data-line="77"
|
|
1831
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:77</a></div>
|
|
1825
1832
|
</td>
|
|
1826
1833
|
</tr>
|
|
1827
1834
|
|
|
@@ -1865,6 +1872,45 @@
|
|
|
1865
1872
|
</tr>
|
|
1866
1873
|
</tbody>
|
|
1867
1874
|
</table>
|
|
1875
|
+
<table class="table table-sm table-bordered">
|
|
1876
|
+
<tbody>
|
|
1877
|
+
<tr>
|
|
1878
|
+
<td class="col-md-4">
|
|
1879
|
+
<a name="ngAfterContentChecked"></a>
|
|
1880
|
+
<span class="name">
|
|
1881
|
+
<span ><b>ngAfterContentChecked</b></span>
|
|
1882
|
+
<a href="#ngAfterContentChecked"><span class="icon ion-ios-link"></span></a>
|
|
1883
|
+
</span>
|
|
1884
|
+
</td>
|
|
1885
|
+
</tr>
|
|
1886
|
+
<tr>
|
|
1887
|
+
<td class="col-md-4">
|
|
1888
|
+
<code>ngAfterContentChecked()</code>
|
|
1889
|
+
</td>
|
|
1890
|
+
</tr>
|
|
1891
|
+
|
|
1892
|
+
|
|
1893
|
+
<tr>
|
|
1894
|
+
<td class="col-md-4">
|
|
1895
|
+
<div class="io-line">Defined in <a href="" data-line="109"
|
|
1896
|
+
class="link-to-prism">src/tooltip/tooltip.component.ts:109</a></div>
|
|
1897
|
+
</td>
|
|
1898
|
+
</tr>
|
|
1899
|
+
|
|
1900
|
+
|
|
1901
|
+
<tr>
|
|
1902
|
+
<td class="col-md-4">
|
|
1903
|
+
<div class="io-description"><p>Check for any changes in the projected content & apply accessibility attribute if needed</p>
|
|
1904
|
+
</div>
|
|
1905
|
+
|
|
1906
|
+
<div class="io-description">
|
|
1907
|
+
<b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
|
|
1908
|
+
|
|
1909
|
+
</div>
|
|
1910
|
+
</td>
|
|
1911
|
+
</tr>
|
|
1912
|
+
</tbody>
|
|
1913
|
+
</table>
|
|
1868
1914
|
<table class="table table-sm table-bordered">
|
|
1869
1915
|
<tbody>
|
|
1870
1916
|
<tr>
|
|
@@ -1985,7 +2031,7 @@
|
|
|
1985
2031
|
</tr>
|
|
1986
2032
|
<tr>
|
|
1987
2033
|
<td class="col-md-4">
|
|
1988
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
2034
|
+
<div class="io-line">Defined in <a href="" data-line="41" class="link-to-prism">src/tooltip/tooltip.component.ts:41</a></div>
|
|
1989
2035
|
</td>
|
|
1990
2036
|
</tr>
|
|
1991
2037
|
|
|
@@ -2017,7 +2063,42 @@
|
|
|
2017
2063
|
</tr>
|
|
2018
2064
|
<tr>
|
|
2019
2065
|
<td class="col-md-4">
|
|
2020
|
-
<div class="io-line">Defined in <a href="" data-line="
|
|
2066
|
+
<div class="io-line">Defined in <a href="" data-line="39" class="link-to-prism">src/tooltip/tooltip.component.ts:39</a></div>
|
|
2067
|
+
</td>
|
|
2068
|
+
</tr>
|
|
2069
|
+
|
|
2070
|
+
|
|
2071
|
+
</tbody>
|
|
2072
|
+
</table>
|
|
2073
|
+
<table class="table table-sm table-bordered">
|
|
2074
|
+
<tbody>
|
|
2075
|
+
<tr>
|
|
2076
|
+
<td class="col-md-4">
|
|
2077
|
+
<a name="wrapper"></a>
|
|
2078
|
+
<span class="name">
|
|
2079
|
+
<span ><b>wrapper</b></span>
|
|
2080
|
+
<a href="#wrapper"><span class="icon ion-ios-link"></span></a>
|
|
2081
|
+
</span>
|
|
2082
|
+
</td>
|
|
2083
|
+
</tr>
|
|
2084
|
+
<tr>
|
|
2085
|
+
<td class="col-md-4">
|
|
2086
|
+
<i>Type : </i> <code>ElementRef<HTMLSpanElement></code>
|
|
2087
|
+
|
|
2088
|
+
</td>
|
|
2089
|
+
</tr>
|
|
2090
|
+
<tr>
|
|
2091
|
+
<td class="col-md-4">
|
|
2092
|
+
<b>Decorators : </b>
|
|
2093
|
+
<br />
|
|
2094
|
+
<code>
|
|
2095
|
+
@ViewChild('contentWrapper')<br />
|
|
2096
|
+
</code>
|
|
2097
|
+
</td>
|
|
2098
|
+
</tr>
|
|
2099
|
+
<tr>
|
|
2100
|
+
<td class="col-md-4">
|
|
2101
|
+
<div class="io-line">Defined in <a href="" data-line="61" class="link-to-prism">src/tooltip/tooltip.component.ts:61</a></div>
|
|
2021
2102
|
</td>
|
|
2022
2103
|
</tr>
|
|
2023
2104
|
|
|
@@ -2072,11 +2153,14 @@
|
|
|
2072
2153
|
|
|
2073
2154
|
<div class="tab-pane fade tab-source-code" id="c-source">
|
|
2074
2155
|
<pre class="line-numbers compodoc-sourcecode"><code class="language-typescript">import {
|
|
2156
|
+
AfterContentChecked,
|
|
2075
2157
|
Component,
|
|
2158
|
+
ElementRef,
|
|
2076
2159
|
HostBinding,
|
|
2077
2160
|
HostListener,
|
|
2078
2161
|
Input,
|
|
2079
|
-
TemplateRef
|
|
2162
|
+
TemplateRef,
|
|
2163
|
+
ViewChild
|
|
2080
2164
|
} from "@angular/core";
|
|
2081
2165
|
import { PopoverContainer } from "carbon-components-angular/popover";
|
|
2082
2166
|
|
|
@@ -2086,16 +2170,14 @@ import { PopoverContainer } from "carbon-components-angular/popover";
|
|
|
2086
2170
|
@Component({
|
|
2087
2171
|
selector: "ibm-tooltip",
|
|
2088
2172
|
template: `
|
|
2089
|
-
<span
|
|
2090
|
-
[attr.aria-labelledby]="this.isTemplate(this.description) ? id : null"
|
|
2091
|
-
[attr.aria-describedby]="!this.isTemplate(this.description) ? id : null">
|
|
2173
|
+
<span #contentWrapper>
|
|
2092
2174
|
<ng-content></ng-content>
|
|
2093
2175
|
</span>
|
|
2094
2176
|
<span
|
|
2095
2177
|
*ngIf="description"
|
|
2096
2178
|
class="cds--popover"
|
|
2097
2179
|
[id]="id"
|
|
2098
|
-
[attr.aria-hidden]="
|
|
2180
|
+
[attr.aria-hidden]="!isOpen"
|
|
2099
2181
|
role="tooltip">
|
|
2100
2182
|
<ng-container *ngIf="!disabled">
|
|
2101
2183
|
<span class="cds--popover-content cds--tooltip-content">
|
|
@@ -2107,7 +2189,7 @@ import { PopoverContainer } from "carbon-components-angular/popover";
|
|
|
2107
2189
|
</span>
|
|
2108
2190
|
`
|
|
2109
2191
|
})
|
|
2110
|
-
export class Tooltip extends PopoverContainer {
|
|
2192
|
+
export class Tooltip extends PopoverContainer implements AfterContentChecked {
|
|
2111
2193
|
static tooltipCount = 0;
|
|
2112
2194
|
|
|
2113
2195
|
@HostBinding("class.cds--tooltip") tooltipClass = true;
|
|
@@ -2130,6 +2212,8 @@ export class Tooltip extends PopoverContainer {
|
|
|
2130
2212
|
*/
|
|
2131
2213
|
@Input() description: string | TemplateRef<any>;
|
|
2132
2214
|
|
|
2215
|
+
@ViewChild("contentWrapper") wrapper: ElementRef<HTMLSpanElement>;
|
|
2216
|
+
|
|
2133
2217
|
constructor() {
|
|
2134
2218
|
super();
|
|
2135
2219
|
this.highContrast = true;
|
|
@@ -2169,9 +2253,21 @@ export class Tooltip extends PopoverContainer {
|
|
|
2169
2253
|
this.handleChange(false, event);
|
|
2170
2254
|
}
|
|
2171
2255
|
|
|
2172
|
-
|
|
2256
|
+
isTemplate(value) {
|
|
2173
2257
|
return value instanceof TemplateRef;
|
|
2174
2258
|
}
|
|
2259
|
+
|
|
2260
|
+
/**
|
|
2261
|
+
* Check for any changes in the projected content & apply accessibility attribute if needed
|
|
2262
|
+
*/
|
|
2263
|
+
ngAfterContentChecked() {
|
|
2264
|
+
if (this.wrapper) {
|
|
2265
|
+
const buttonElement = this.wrapper.nativeElement.querySelector("button");
|
|
2266
|
+
if (buttonElement && !buttonElement.getAttribute("aria-labelledby")) {
|
|
2267
|
+
buttonElement.setAttribute("aria-labelledby", this.id);
|
|
2268
|
+
}
|
|
2269
|
+
}
|
|
2270
|
+
}
|
|
2175
2271
|
}
|
|
2176
2272
|
</code></pre>
|
|
2177
2273
|
</div>
|
|
@@ -2203,7 +2299,7 @@ export class Tooltip extends PopoverContainer {
|
|
|
2203
2299
|
<script src="../js/libs/htmlparser.js"></script>
|
|
2204
2300
|
<script src="../js/libs/deep-iterator.js"></script>
|
|
2205
2301
|
<script>
|
|
2206
|
-
var COMPONENT_TEMPLATE = '<div><span
|
|
2302
|
+
var COMPONENT_TEMPLATE = '<div><span #contentWrapper> <ng-content></ng-content></span><span *ngIf="description" class="cds--popover" [id]="id" [attr.aria-hidden]="!isOpen" role="tooltip"> <ng-container *ngIf="!disabled"> <span class="cds--popover-content cds--tooltip-content"> <ng-container *ngIf="!isTemplate(description)">{{description}}</ng-container> <ng-template *ngIf="isTemplate(description)" [ngTemplateOutlet]="description"></ng-template> </span> <span class="cds--popover-caret"></span> </ng-container></span> </div>'
|
|
2207
2303
|
var COMPONENTS = [{'name': 'Accordion', 'selector': 'ibm-accordion'},{'name': 'AccordionItem', 'selector': 'ibm-accordion-item'},{'name': 'ActionableNotification', 'selector': 'ibm-actionable-notification'},{'name': 'AlertModal', 'selector': 'ibm-alert-modal'},{'name': 'BaseIconButton', 'selector': ''},{'name': 'BaseNotification', 'selector': ''},{'name': 'BaseTabHeader', 'selector': ''},{'name': 'Breadcrumb', 'selector': 'ibm-breadcrumb'},{'name': 'BreadcrumbItemComponent', 'selector': 'ibm-breadcrumb-item'},{'name': 'ButtonSet', 'selector': 'ibm-button-set'},{'name': 'Checkbox', 'selector': 'ibm-checkbox'},{'name': 'ClickableTile', 'selector': 'ibm-clickable-tile'},{'name': 'CodeSnippet', 'selector': 'ibm-code-snippet'},{'name': 'ComboBox', 'selector': 'ibm-combo-box'},{'name': 'ContentSwitcher', 'selector': 'ibm-content-switcher'},{'name': 'ContextMenuComponent', 'selector': 'ibm-context-menu'},{'name': 'ContextMenuDividerComponent', 'selector': 'ibm-context-menu-divider'},{'name': 'ContextMenuGroupComponent', 'selector': 'ibm-context-menu-group'},{'name': 'ContextMenuItemComponent', 'selector': 'ibm-context-menu-item'},{'name': 'DatePicker', 'selector': 'ibm-date-picker'},{'name': 'DatePickerInput', 'selector': 'ibm-date-picker-input'},{'name': 'Dialog', 'selector': 'ibm-dialog'},{'name': 'Documentation', 'selector': 'ibm-documentation'},{'name': 'Dropdown', 'selector': 'ibm-dropdown'},{'name': 'DropdownList', 'selector': 'ibm-dropdown-list'},{'name': 'ExpandableTile', 'selector': 'ibm-expandable-tile'},{'name': 'FileComponent', 'selector': 'ibm-file'},{'name': 'FileUploader', 'selector': 'ibm-file-uploader'},{'name': 'Hamburger', 'selector': 'ibm-hamburger'},{'name': 'Header', 'selector': 'ibm-header'},{'name': 'HeaderAction', 'selector': 'ibm-header-action'},{'name': 'HeaderGlobal', 'selector': 'ibm-header-global'},{'name': 'HeaderItem', 'selector': 'ibm-header-item'},{'name': 'HeaderMenu', 'selector': 'ibm-header-menu'},{'name': 'HeaderNavigation', 'selector': 'ibm-header-navigation'},{'name': 'IconButton', 'selector': 'ibm-icon-button'},{'name': 'InlineLoading', 'selector': 'ibm-inline-loading'},{'name': 'Label', 'selector': 'ibm-label'},{'name': 'ListColumn', 'selector': 'ibm-list-column'},{'name': 'ListHeader', 'selector': 'ibm-list-header'},{'name': 'ListRow', 'selector': 'ibm-list-row'},{'name': 'Loading', 'selector': 'ibm-loading'},{'name': 'Modal', 'selector': 'ibm-modal'},{'name': 'ModalFooter', 'selector': 'ibm-modal-footer'},{'name': 'ModalHeader', 'selector': 'ibm-modal-header'},{'name': 'Notification', 'selector': 'ibm-notification,ibm-inline-notification'},{'name': 'NumberComponent', 'selector': 'ibm-number'},{'name': 'OverflowMenu', 'selector': 'ibm-overflow-menu'},{'name': 'OverflowMenuCustomPane', 'selector': 'ibm-overflow-custom-menu-pane'},{'name': 'OverflowMenuOption', 'selector': 'ibm-overflow-menu-option'},{'name': 'OverflowMenuPane', 'selector': 'ibm-overflow-menu-pane'},{'name': 'Overlay', 'selector': 'ibm-overlay'},{'name': 'Pagination', 'selector': 'ibm-pagination'},{'name': 'PaginationNav', 'selector': 'ibm-pagination-nav'},{'name': 'PaginationNavItem', 'selector': 'ibm-pagination-nav-item'},{'name': 'PaginationOverflow', 'selector': 'ibm-pagination-overflow'},{'name': 'Panel', 'selector': 'ibm-panel'},{'name': 'Placeholder', 'selector': 'ibm-placeholder'},{'name': 'PopoverContent', 'selector': 'ibm-popover-content'},{'name': 'ProgressBar', 'selector': 'ibm-progress-bar'},{'name': 'ProgressIndicator', 'selector': 'ibm-progress-indicator'},{'name': 'Radio', 'selector': 'ibm-radio'},{'name': 'RadioGroup', 'selector': 'ibm-radio-group'},{'name': 'Search', 'selector': 'ibm-search'},{'name': 'Select', 'selector': 'ibm-select'},{'name': 'SelectionTile', 'selector': 'ibm-selection-tile'},{'name': 'SideNav', 'selector': 'ibm-sidenav'},{'name': 'SideNavItem', 'selector': 'ibm-sidenav-item'},{'name': 'SideNavMenu', 'selector': 'ibm-sidenav-menu'},{'name': 'SkeletonPlaceholder', 'selector': 'ibm-skeleton-placeholder'},{'name': 'SkeletonText', 'selector': 'ibm-skeleton-text'},{'name': 'Slider', 'selector': 'ibm-slider'},{'name': 'StructuredList', 'selector': 'ibm-structured-list'},{'name': 'SwitcherList', 'selector': 'ibm-switcher-list'},{'name': 'SwitcherListItem', 'selector': 'ibm-switcher-list-item'},{'name': 'Tab', 'selector': 'ibm-tab'},{'name': 'TabHeaderGroup', 'selector': 'ibm-tab-header-group'},{'name': 'TabHeaders', 'selector': 'ibm-tab-headers'},{'name': 'Table', 'selector': 'ibm-table'},{'name': 'TableBody', 'selector': '[ibmTableBody]'},{'name': 'TableCheckbox', 'selector': '[ibmTableCheckbox]'},{'name': 'TableContainer', 'selector': 'ibm-table-container'},{'name': 'TableData', 'selector': '[ibmTableData]'},{'name': 'TableExpandButton', 'selector': '[ibmTableExpandButton]'},{'name': 'TableExpandedRow', 'selector': '[ibmTableExpandedRow]'},{'name': 'TableHead', 'selector': '[ibmTableHead]'},{'name': 'TableHeadCell', 'selector': '[ibmTableHeadCell]'},{'name': 'TableHeadCheckbox', 'selector': '[ibmTableHeadCheckbox]'},{'name': 'TableHeader', 'selector': 'ibm-table-header'},{'name': 'TableHeadExpand', 'selector': '[ibmTableHeadExpand]'},{'name': 'TableRadio', 'selector': '[ibmTableRadio]'},{'name': 'TableRowComponent', 'selector': '[ibmTableRow]'},{'name': 'TableToolbar', 'selector': 'ibm-table-toolbar'},{'name': 'TableToolbarActions', 'selector': 'ibm-table-toolbar-actions'},{'name': 'TableToolbarContent', 'selector': 'ibm-table-toolbar-content'},{'name': 'TableToolbarSearch', 'selector': 'ibm-table-toolbar-search'},{'name': 'Tabs', 'selector': 'ibm-tabs'},{'name': 'TabSkeleton', 'selector': 'ibm-tabs-skeleton'},{'name': 'Tag', 'selector': 'ibm-tag'},{'name': 'TagFilter', 'selector': 'ibm-tag-filter'},{'name': 'Tile', 'selector': 'ibm-tile'},{'name': 'TileGroup', 'selector': 'ibm-tile-group'},{'name': 'TimePicker', 'selector': 'ibm-timepicker'},{'name': 'TimePickerSelect', 'selector': 'ibm-timepicker-select'},{'name': 'Toast', 'selector': 'ibm-toast'},{'name': 'Toggle', 'selector': 'ibm-toggle'},{'name': 'Toggletip', 'selector': 'ibm-toggletip'},{'name': 'Tooltip', 'selector': 'ibm-tooltip'},{'name': 'TooltipDefinition', 'selector': 'ibm-tooltip-definition'}];
|
|
2208
2304
|
var DIRECTIVES = [{'name': 'AbstractDropdownView', 'selector': '[ibmAbstractDropdownView]'},{'name': 'ActionableButton', 'selector': '[ibmActionableButton]'},{'name': 'ActionableSubtitle', 'selector': '[ibmActionableSubtitle]'},{'name': 'ActionableTitle', 'selector': '[ibmActionableTitle]'},{'name': 'BaseModal', 'selector': '[ibmBaseModal]'},{'name': 'Button', 'selector': '[ibmButton]'},{'name': 'ColumnDirective', 'selector': '[ibmCol]'},{'name': 'ContentSwitcherOption', 'selector': '[ibmContentOption]'},{'name': 'DialogDirective', 'selector': '[ibmDialog]'},{'name': 'ExpandedRowHover', 'selector': '[ibmExpandedRowHover]'},{'name': 'GridDirective', 'selector': '[ibmGrid]'},{'name': 'IconDirective', 'selector': '[ibmIcon]'},{'name': 'LayerDirective', 'selector': '[ibmLayer]'},{'name': 'Link', 'selector': '[ibmLink]'},{'name': 'List', 'selector': '[ibmList]'},{'name': 'ListItemDirective', 'selector': '[ibmListItem]'},{'name': 'ModalContent', 'selector': '[ibmModalContent]'},{'name': 'ModalContentText', 'selector': '[ibmModalContentText]'},{'name': 'ModalHeaderHeading', 'selector': '[ibmModalHeaderHeading]'},{'name': 'ModalHeaderLabel', 'selector': '[ibmModalHeaderLabel]'},{'name': 'NotificationSubtitle', 'selector': '[ibmNotificationSubtitle]'},{'name': 'NotificationTitle', 'selector': '[ibmNotificationTitle]'},{'name': 'OptGroup', 'selector': 'optgroup'},{'name': 'Option', 'selector': 'option'},{'name': 'OverflowMenuDirective', 'selector': '[ibmOverflowMenu]'},{'name': 'PopoverContainer', 'selector': '[ibmPopover]'},{'name': 'RowDirective', 'selector': '[ibmRow]'},{'name': 'ScrollableList', 'selector': '[ibmScrollableList]'},{'name': 'StackDirective', 'selector': '[ibmStack]'},{'name': 'TabHeader', 'selector': '[ibmTabHeader]'},{'name': 'TableDirective', 'selector': '[ibmTable]'},{'name': 'TableHeadCellLabel', 'selector': '[ibmTableHeadCellLabel]'},{'name': 'TableHeaderDescription', 'selector': '[ibmTableHeaderDescription]'},{'name': 'TableHeaderTitle', 'selector': '[ibmTableHeaderTitle]'},{'name': 'TextArea', 'selector': '[ibmTextArea]'},{'name': 'TextInput', 'selector': '[ibmText]'},{'name': 'ThemeDirective', 'selector': '[ibmTheme]'},{'name': 'ToastCaption', 'selector': '[ibmToastCaption]'},{'name': 'ToastSubtitle', 'selector': '[ibmToastSubtitle]'},{'name': 'ToastTitle', 'selector': '[ibmToastTitle]'},{'name': 'ToggletipAction', 'selector': '[ibmToggletipAction]'},{'name': 'ToggletipButton', 'selector': '[ibmToggletipButton]'},{'name': 'ToggletipContent', 'selector': '[ibmToggletipContent]'},{'name': 'ToggletipLabel', 'selector': '[ibmToggletipLabel]'}];
|
|
2209
2305
|
var ACTUAL_COMPONENT = {'name': 'Tooltip'};
|
|
@@ -2378,9 +2378,9 @@
|
|
|
2378
2378
|
</td>
|
|
2379
2379
|
<td>directive</td>
|
|
2380
2380
|
<td>TableDirective</td>
|
|
2381
|
-
<td align="right" data-sort="
|
|
2382
|
-
<span class="coverage-percent">
|
|
2383
|
-
<span class="coverage-count">(1/
|
|
2381
|
+
<td align="right" data-sort="7">
|
|
2382
|
+
<span class="coverage-percent">7 %</span>
|
|
2383
|
+
<span class="coverage-count">(1/13)</span>
|
|
2384
2384
|
</td>
|
|
2385
2385
|
</tr>
|
|
2386
2386
|
<tr class="low">
|
|
@@ -2774,9 +2774,9 @@
|
|
|
2774
2774
|
</td>
|
|
2775
2775
|
<td>component</td>
|
|
2776
2776
|
<td>Tooltip</td>
|
|
2777
|
-
<td align="right" data-sort="
|
|
2778
|
-
<span class="coverage-percent">
|
|
2779
|
-
<span class="coverage-count">(
|
|
2777
|
+
<td align="right" data-sort="19">
|
|
2778
|
+
<span class="coverage-percent">19 %</span>
|
|
2779
|
+
<span class="coverage-count">(9/46)</span>
|
|
2780
2780
|
</td>
|
|
2781
2781
|
</tr>
|
|
2782
2782
|
<tr class="very-good">
|