carbon-components-angular 5.27.2 → 5.27.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.
Files changed (67) hide show
  1. package/docs/documentation/components/TreeNodeComponent.html +81 -47
  2. package/docs/documentation/components/TreeViewComponent.html +145 -28
  3. package/docs/documentation/coverage.html +7 -7
  4. package/docs/documentation/interfaces/Node.html +47 -1
  5. package/docs/documentation/js/search/search_index.js +2 -2
  6. package/docs/documentation/modules/CodeSnippetModule/dependencies.svg +4 -4
  7. package/docs/documentation/modules/CodeSnippetModule.html +4 -4
  8. package/docs/documentation/modules/ComboBoxModule/dependencies.svg +4 -4
  9. package/docs/documentation/modules/ComboBoxModule.html +4 -4
  10. package/docs/documentation/modules/ContentSwitcherModule/dependencies.svg +4 -4
  11. package/docs/documentation/modules/ContentSwitcherModule.html +4 -4
  12. package/docs/documentation/modules/DatePickerInputModule/dependencies.svg +20 -20
  13. package/docs/documentation/modules/DatePickerInputModule.html +20 -20
  14. package/docs/documentation/modules/DatePickerModule/dependencies.svg +46 -50
  15. package/docs/documentation/modules/DatePickerModule.html +46 -50
  16. package/docs/documentation/modules/FileUploaderModule/dependencies.svg +58 -58
  17. package/docs/documentation/modules/FileUploaderModule.html +58 -58
  18. package/docs/documentation/modules/NumberModule/dependencies.svg +4 -4
  19. package/docs/documentation/modules/NumberModule.html +4 -4
  20. package/docs/documentation/modules/PanelModule/dependencies.svg +36 -36
  21. package/docs/documentation/modules/PanelModule.html +36 -36
  22. package/docs/documentation/modules/RadioModule/dependencies.svg +47 -43
  23. package/docs/documentation/modules/RadioModule.html +47 -43
  24. package/docs/documentation/modules/SearchModule/dependencies.svg +4 -4
  25. package/docs/documentation/modules/SearchModule.html +4 -4
  26. package/docs/documentation/modules/SelectModule/dependencies.svg +34 -34
  27. package/docs/documentation/modules/SelectModule.html +34 -34
  28. package/docs/documentation/modules/SliderModule/dependencies.svg +4 -4
  29. package/docs/documentation/modules/SliderModule.html +4 -4
  30. package/docs/documentation/modules/TagModule/dependencies.svg +28 -28
  31. package/docs/documentation/modules/TagModule.html +28 -28
  32. package/docs/documentation/modules/ThemeModule/dependencies.svg +13 -13
  33. package/docs/documentation/modules/ThemeModule.html +13 -13
  34. package/docs/documentation/modules/TilesModule/dependencies.svg +4 -4
  35. package/docs/documentation/modules/TilesModule.html +4 -4
  36. package/docs/documentation/modules/TimePickerModule/dependencies.svg +26 -26
  37. package/docs/documentation/modules/TimePickerModule.html +26 -26
  38. package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +45 -49
  39. package/docs/documentation/modules/TimePickerSelectModule.html +45 -49
  40. package/docs/documentation/modules/ToggleModule/dependencies.svg +37 -41
  41. package/docs/documentation/modules/ToggleModule.html +37 -41
  42. package/docs/documentation/modules/ToggletipModule/dependencies.svg +4 -4
  43. package/docs/documentation/modules/ToggletipModule.html +4 -4
  44. package/docs/documentation/modules/TooltipModule/dependencies.svg +28 -28
  45. package/docs/documentation/modules/TooltipModule.html +28 -28
  46. package/docs/documentation/modules/TreeviewModule/dependencies.svg +34 -34
  47. package/docs/documentation/modules/TreeviewModule.html +34 -34
  48. package/docs/documentation/modules/UIShellModule/dependencies.svg +4 -4
  49. package/docs/documentation/modules/UIShellModule.html +4 -4
  50. package/docs/documentation.json +129 -71
  51. package/docs/storybook/iframe.html +2 -2
  52. package/docs/storybook/main.8aa17fcd.iframe.bundle.js +1 -0
  53. package/docs/storybook/project.json +1 -1
  54. package/docs/storybook/{runtime~main.8e48d2b3.iframe.bundle.js → runtime~main.f8a93a5f.iframe.bundle.js} +1 -1
  55. package/docs/storybook/{treeview-treeview-stories.325fff71.iframe.bundle.js → treeview-treeview-stories.0b6b2e75.iframe.bundle.js} +1 -1
  56. package/esm2020/treeview/tree-node.component.mjs +16 -5
  57. package/esm2020/treeview/tree-node.types.mjs +1 -1
  58. package/esm2020/treeview/treeview.component.mjs +21 -6
  59. package/fesm2015/carbon-components-angular-treeview.mjs +35 -9
  60. package/fesm2015/carbon-components-angular-treeview.mjs.map +1 -1
  61. package/fesm2020/carbon-components-angular-treeview.mjs +34 -8
  62. package/fesm2020/carbon-components-angular-treeview.mjs.map +1 -1
  63. package/package.json +1 -1
  64. package/treeview/tree-node.component.d.ts +2 -1
  65. package/treeview/tree-node.types.d.ts +1 -0
  66. package/treeview/treeview.component.d.ts +6 -1
  67. package/docs/storybook/main.7fac046f.iframe.bundle.js +0 -1
package/docs/documentation/components/TreeNodeComponent.html CHANGED
@@ -219,7 +219,11 @@
219
219
  size="16">
220
220
  </svg>
221
221
  </ng-container>
222
- <ng-template *ngIf="isTemplate(icon)" [ngTemplateOutlet]="icon"></ng-template>
222
+ <ng-template
223
+ *ngIf="isTemplate(icon)"
224
+ [ngTemplateOutlet]="icon"
225
+ [ngTemplateOutletContext]="{ $implicit: iconContext }">
226
+ </ng-template>
223
227
  {{label}}
224
228
  </span>
225
229
  </div>
@@ -359,6 +363,9 @@
359
363
  <li>
360
364
  <a href="#icon" >icon</a>
361
365
  </li>
366
+ <li>
367
+ <a href="#iconContext" >iconContext</a>
368
+ </li>
362
369
  <li>
363
370
  <a href="#id" >id</a>
364
371
  </li>
@@ -433,7 +440,7 @@
433
440
  </tr>
434
441
  <tr>
435
442
  <td class="col-md-4">
436
- <div class="io-line">Defined in <a href="" data-line="154" class="link-to-prism">src/treeview/tree-node.component.ts:154</a></div>
443
+ <div class="io-line">Defined in <a href="" data-line="160" class="link-to-prism">src/treeview/tree-node.component.ts:160</a></div>
437
444
  </td>
438
445
  </tr>
439
446
 
@@ -494,7 +501,7 @@
494
501
  </tr>
495
502
  <tr>
496
503
  <td class="col-md-2" colspan="2">
497
- <div class="io-line">Defined in <a href="" data-line="109" class="link-to-prism">src/treeview/tree-node.component.ts:109</a></div>
504
+ <div class="io-line">Defined in <a href="" data-line="113" class="link-to-prism">src/treeview/tree-node.component.ts:113</a></div>
498
505
  </td>
499
506
  </tr>
500
507
  </tbody>
@@ -520,7 +527,7 @@
520
527
  </tr>
521
528
  <tr>
522
529
  <td class="col-md-2" colspan="2">
523
- <div class="io-line">Defined in <a href="" data-line="116" class="link-to-prism">src/treeview/tree-node.component.ts:116</a></div>
530
+ <div class="io-line">Defined in <a href="" data-line="121" class="link-to-prism">src/treeview/tree-node.component.ts:121</a></div>
524
531
  </td>
525
532
  </tr>
526
533
  </tbody>
@@ -546,7 +553,7 @@
546
553
  </tr>
547
554
  <tr>
548
555
  <td class="col-md-2" colspan="2">
549
- <div class="io-line">Defined in <a href="" data-line="122" class="link-to-prism">src/treeview/tree-node.component.ts:122</a></div>
556
+ <div class="io-line">Defined in <a href="" data-line="127" class="link-to-prism">src/treeview/tree-node.component.ts:127</a></div>
550
557
  </td>
551
558
  </tr>
552
559
  <tr>
@@ -579,7 +586,7 @@ Calculated by default when passing <code>Node</code> array to <code>TreeViewComp
579
586
  </tr>
580
587
  <tr>
581
588
  <td class="col-md-2" colspan="2">
582
- <div class="io-line">Defined in <a href="" data-line="110" class="link-to-prism">src/treeview/tree-node.component.ts:110</a></div>
589
+ <div class="io-line">Defined in <a href="" data-line="114" class="link-to-prism">src/treeview/tree-node.component.ts:114</a></div>
583
590
  </td>
584
591
  </tr>
585
592
  </tbody>
@@ -605,7 +612,7 @@ Calculated by default when passing <code>Node</code> array to <code>TreeViewComp
605
612
  </tr>
606
613
  <tr>
607
614
  <td class="col-md-2" colspan="2">
608
- <div class="io-line">Defined in <a href="" data-line="111" class="link-to-prism">src/treeview/tree-node.component.ts:111</a></div>
615
+ <div class="io-line">Defined in <a href="" data-line="115" class="link-to-prism">src/treeview/tree-node.component.ts:115</a></div>
609
616
  </td>
610
617
  </tr>
611
618
  </tbody>
@@ -626,7 +633,28 @@ Calculated by default when passing <code>Node</code> array to <code>TreeViewComp
626
633
  </tr>
627
634
  <tr>
628
635
  <td class="col-md-2" colspan="2">
629
- <div class="io-line">Defined in <a href="" data-line="115" class="link-to-prism">src/treeview/tree-node.component.ts:115</a></div>
636
+ <div class="io-line">Defined in <a href="" data-line="119" class="link-to-prism">src/treeview/tree-node.component.ts:119</a></div>
637
+ </td>
638
+ </tr>
639
+ </tbody>
640
+ </table>
641
+ <table class="table table-sm table-bordered">
642
+ <tbody>
643
+ <tr>
644
+ <td class="col-md-4">
645
+ <a name="iconContext"></a>
646
+ <b>iconContext</b>
647
+ </td>
648
+ </tr>
649
+ <tr>
650
+ <td class="col-md-4">
651
+ <i>Type : </i> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >any</a></code>
652
+
653
+ </td>
654
+ </tr>
655
+ <tr>
656
+ <td class="col-md-2" colspan="2">
657
+ <div class="io-line">Defined in <a href="" data-line="120" class="link-to-prism">src/treeview/tree-node.component.ts:120</a></div>
630
658
  </td>
631
659
  </tr>
632
660
  </tbody>
@@ -652,7 +680,7 @@ Calculated by default when passing <code>Node</code> array to <code>TreeViewComp
652
680
  </tr>
653
681
  <tr>
654
682
  <td class="col-md-2" colspan="2">
655
- <div class="io-line">Defined in <a href="" data-line="108" class="link-to-prism">src/treeview/tree-node.component.ts:108</a></div>
683
+ <div class="io-line">Defined in <a href="" data-line="112" class="link-to-prism">src/treeview/tree-node.component.ts:112</a></div>
656
684
  </td>
657
685
  </tr>
658
686
  </tbody>
@@ -673,7 +701,7 @@ Calculated by default when passing <code>Node</code> array to <code>TreeViewComp
673
701
  </tr>
674
702
  <tr>
675
703
  <td class="col-md-2" colspan="2">
676
- <div class="io-line">Defined in <a href="" data-line="112" class="link-to-prism">src/treeview/tree-node.component.ts:112</a></div>
704
+ <div class="io-line">Defined in <a href="" data-line="116" class="link-to-prism">src/treeview/tree-node.component.ts:116</a></div>
677
705
  </td>
678
706
  </tr>
679
707
  </tbody>
@@ -694,7 +722,7 @@ Calculated by default when passing <code>Node</code> array to <code>TreeViewComp
694
722
  </tr>
695
723
  <tr>
696
724
  <td class="col-md-2" colspan="2">
697
- <div class="io-line">Defined in <a href="" data-line="128" class="link-to-prism">src/treeview/tree-node.component.ts:128</a></div>
725
+ <div class="io-line">Defined in <a href="" data-line="133" class="link-to-prism">src/treeview/tree-node.component.ts:133</a></div>
698
726
  </td>
699
727
  </tr>
700
728
  <tr>
@@ -727,7 +755,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
727
755
  </tr>
728
756
  <tr>
729
757
  <td class="col-md-2" colspan="2">
730
- <div class="io-line">Defined in <a href="" data-line="113" class="link-to-prism">src/treeview/tree-node.component.ts:113</a></div>
758
+ <div class="io-line">Defined in <a href="" data-line="117" class="link-to-prism">src/treeview/tree-node.component.ts:117</a></div>
731
759
  </td>
732
760
  </tr>
733
761
  </tbody>
@@ -748,7 +776,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
748
776
  </tr>
749
777
  <tr>
750
778
  <td class="col-md-2" colspan="2">
751
- <div class="io-line">Defined in <a href="" data-line="114" class="link-to-prism">src/treeview/tree-node.component.ts:114</a></div>
779
+ <div class="io-line">Defined in <a href="" data-line="118" class="link-to-prism">src/treeview/tree-node.component.ts:118</a></div>
752
780
  </td>
753
781
  </tr>
754
782
  </tbody>
@@ -772,7 +800,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
772
800
  </tr>
773
801
  <tr>
774
802
  <td class="col-md-2" colspan="2">
775
- <div class="io-line">Defined in <a href="" data-line="148" class="link-to-prism">src/treeview/tree-node.component.ts:148</a></div>
803
+ <div class="io-line">Defined in <a href="" data-line="154" class="link-to-prism">src/treeview/tree-node.component.ts:154</a></div>
776
804
  </td>
777
805
  </tr>
778
806
  </tbody>
@@ -793,7 +821,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
793
821
  </tr>
794
822
  <tr>
795
823
  <td class="col-md-2" colspan="2">
796
- <div class="io-line">Defined in <a href="" data-line="147" class="link-to-prism">src/treeview/tree-node.component.ts:147</a></div>
824
+ <div class="io-line">Defined in <a href="" data-line="153" class="link-to-prism">src/treeview/tree-node.component.ts:153</a></div>
797
825
  </td>
798
826
  </tr>
799
827
  </tbody>
@@ -814,7 +842,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
814
842
  </tr>
815
843
  <tr>
816
844
  <td class="col-md-2" colspan="2">
817
- <div class="io-line">Defined in <a href="" data-line="149" class="link-to-prism">src/treeview/tree-node.component.ts:149</a></div>
845
+ <div class="io-line">Defined in <a href="" data-line="155" class="link-to-prism">src/treeview/tree-node.component.ts:155</a></div>
818
846
  </td>
819
847
  </tr>
820
848
  </tbody>
@@ -835,7 +863,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
835
863
  </tr>
836
864
  <tr>
837
865
  <td class="col-md-2" colspan="2">
838
- <div class="io-line">Defined in <a href="" data-line="150" class="link-to-prism">src/treeview/tree-node.component.ts:150</a></div>
866
+ <div class="io-line">Defined in <a href="" data-line="156" class="link-to-prism">src/treeview/tree-node.component.ts:156</a></div>
839
867
  </td>
840
868
  </tr>
841
869
  </tbody>
@@ -868,8 +896,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
868
896
 
869
897
  <tr>
870
898
  <td class="col-md-4">
871
- <div class="io-line">Defined in <a href="" data-line="201"
872
- class="link-to-prism">src/treeview/tree-node.component.ts:201</a></div>
899
+ <div class="io-line">Defined in <a href="" data-line="207"
900
+ class="link-to-prism">src/treeview/tree-node.component.ts:207</a></div>
873
901
  </td>
874
902
  </tr>
875
903
 
@@ -911,8 +939,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
911
939
 
912
940
  <tr>
913
941
  <td class="col-md-4">
914
- <div class="io-line">Defined in <a href="" data-line="224"
915
- class="link-to-prism">src/treeview/tree-node.component.ts:224</a></div>
942
+ <div class="io-line">Defined in <a href="" data-line="230"
943
+ class="link-to-prism">src/treeview/tree-node.component.ts:230</a></div>
916
944
  </td>
917
945
  </tr>
918
946
 
@@ -974,8 +1002,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
974
1002
 
975
1003
  <tr>
976
1004
  <td class="col-md-4">
977
- <div class="io-line">Defined in <a href="" data-line="220"
978
- class="link-to-prism">src/treeview/tree-node.component.ts:220</a></div>
1005
+ <div class="io-line">Defined in <a href="" data-line="226"
1006
+ class="link-to-prism">src/treeview/tree-node.component.ts:226</a></div>
979
1007
  </td>
980
1008
  </tr>
981
1009
 
@@ -1039,8 +1067,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1039
1067
 
1040
1068
  <tr>
1041
1069
  <td class="col-md-4">
1042
- <div class="io-line">Defined in <a href="" data-line="271"
1043
- class="link-to-prism">src/treeview/tree-node.component.ts:271</a></div>
1070
+ <div class="io-line">Defined in <a href="" data-line="277"
1071
+ class="link-to-prism">src/treeview/tree-node.component.ts:277</a></div>
1044
1072
  </td>
1045
1073
  </tr>
1046
1074
 
@@ -1078,8 +1106,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1078
1106
 
1079
1107
  <tr>
1080
1108
  <td class="col-md-4">
1081
- <div class="io-line">Defined in <a href="" data-line="267"
1082
- class="link-to-prism">src/treeview/tree-node.component.ts:267</a></div>
1109
+ <div class="io-line">Defined in <a href="" data-line="273"
1110
+ class="link-to-prism">src/treeview/tree-node.component.ts:273</a></div>
1083
1111
  </td>
1084
1112
  </tr>
1085
1113
 
@@ -1141,8 +1169,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1141
1169
 
1142
1170
  <tr>
1143
1171
  <td class="col-md-4">
1144
- <div class="io-line">Defined in <a href="" data-line="244"
1145
- class="link-to-prism">src/treeview/tree-node.component.ts:244</a></div>
1172
+ <div class="io-line">Defined in <a href="" data-line="250"
1173
+ class="link-to-prism">src/treeview/tree-node.component.ts:250</a></div>
1146
1174
  </td>
1147
1175
  </tr>
1148
1176
 
@@ -1210,8 +1238,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1210
1238
 
1211
1239
  <tr>
1212
1240
  <td class="col-md-4">
1213
- <div class="io-line">Defined in <a href="" data-line="161"
1214
- class="link-to-prism">src/treeview/tree-node.component.ts:161</a></div>
1241
+ <div class="io-line">Defined in <a href="" data-line="167"
1242
+ class="link-to-prism">src/treeview/tree-node.component.ts:167</a></div>
1215
1243
  </td>
1216
1244
  </tr>
1217
1245
 
@@ -1249,8 +1277,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1249
1277
 
1250
1278
  <tr>
1251
1279
  <td class="col-md-4">
1252
- <div class="io-line">Defined in <a href="" data-line="179"
1253
- class="link-to-prism">src/treeview/tree-node.component.ts:179</a></div>
1280
+ <div class="io-line">Defined in <a href="" data-line="185"
1281
+ class="link-to-prism">src/treeview/tree-node.component.ts:185</a></div>
1254
1282
  </td>
1255
1283
  </tr>
1256
1284
 
@@ -1288,8 +1316,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1288
1316
 
1289
1317
  <tr>
1290
1318
  <td class="col-md-4">
1291
- <div class="io-line">Defined in <a href="" data-line="168"
1292
- class="link-to-prism">src/treeview/tree-node.component.ts:168</a></div>
1319
+ <div class="io-line">Defined in <a href="" data-line="174"
1320
+ class="link-to-prism">src/treeview/tree-node.component.ts:174</a></div>
1293
1321
  </td>
1294
1322
  </tr>
1295
1323
 
@@ -1327,8 +1355,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1327
1355
 
1328
1356
  <tr>
1329
1357
  <td class="col-md-4">
1330
- <div class="io-line">Defined in <a href="" data-line="187"
1331
- class="link-to-prism">src/treeview/tree-node.component.ts:187</a></div>
1358
+ <div class="io-line">Defined in <a href="" data-line="193"
1359
+ class="link-to-prism">src/treeview/tree-node.component.ts:193</a></div>
1332
1360
  </td>
1333
1361
  </tr>
1334
1362
 
@@ -1392,8 +1420,8 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1392
1420
 
1393
1421
  <tr>
1394
1422
  <td class="col-md-4">
1395
- <div class="io-line">Defined in <a href="" data-line="232"
1396
- class="link-to-prism">src/treeview/tree-node.component.ts:232</a></div>
1423
+ <div class="io-line">Defined in <a href="" data-line="238"
1424
+ class="link-to-prism">src/treeview/tree-node.component.ts:238</a></div>
1397
1425
  </td>
1398
1426
  </tr>
1399
1427
 
@@ -1462,7 +1490,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1462
1490
  </tr>
1463
1491
  <tr>
1464
1492
  <td class="col-md-4">
1465
- <div class="io-line">Defined in <a href="" data-line="153" class="link-to-prism">src/treeview/tree-node.component.ts:153</a></div>
1493
+ <div class="io-line">Defined in <a href="" data-line="159" class="link-to-prism">src/treeview/tree-node.component.ts:159</a></div>
1466
1494
  </td>
1467
1495
  </tr>
1468
1496
 
@@ -1482,7 +1510,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1482
1510
  </tr>
1483
1511
  <tr>
1484
1512
  <td class="col-md-4">
1485
- <div class="io-line">Defined in <a href="" data-line="152" class="link-to-prism">src/treeview/tree-node.component.ts:152</a></div>
1513
+ <div class="io-line">Defined in <a href="" data-line="158" class="link-to-prism">src/treeview/tree-node.component.ts:158</a></div>
1486
1514
  </td>
1487
1515
  </tr>
1488
1516
 
@@ -1509,7 +1537,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1509
1537
  </tr>
1510
1538
  <tr>
1511
1539
  <td class="col-md-4">
1512
- <div class="io-line">Defined in <a href="" data-line="154" class="link-to-prism">src/treeview/tree-node.component.ts:154</a></div>
1540
+ <div class="io-line">Defined in <a href="" data-line="160" class="link-to-prism">src/treeview/tree-node.component.ts:160</a></div>
1513
1541
  </td>
1514
1542
  </tr>
1515
1543
 
@@ -1541,7 +1569,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1541
1569
  </tr>
1542
1570
  <tr>
1543
1571
  <td class="col-md-4">
1544
- <div class="io-line">Defined in <a href="" data-line="107" class="link-to-prism">src/treeview/tree-node.component.ts:107</a></div>
1572
+ <div class="io-line">Defined in <a href="" data-line="111" class="link-to-prism">src/treeview/tree-node.component.ts:111</a></div>
1545
1573
  </td>
1546
1574
  </tr>
1547
1575
 
@@ -1570,7 +1598,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1570
1598
  </tr>
1571
1599
  <tr>
1572
1600
  <td class="col-md-4">
1573
- <div class="io-line">Defined in <a href="" data-line="143" class="link-to-prism">src/treeview/tree-node.component.ts:143</a></div>
1601
+ <div class="io-line">Defined in <a href="" data-line="149" class="link-to-prism">src/treeview/tree-node.component.ts:149</a></div>
1574
1602
  </td>
1575
1603
  </tr>
1576
1604
 
@@ -1581,7 +1609,7 @@ Would simplify setting component attributes when dynamically rendering node.</p>
1581
1609
  </tr>
1582
1610
  <tr>
1583
1611
  <td class="col-md-4">
1584
- <div class="io-line">Defined in <a href="" data-line="128" class="link-to-prism">src/treeview/tree-node.component.ts:128</a></div>
1612
+ <div class="io-line">Defined in <a href="" data-line="133" class="link-to-prism">src/treeview/tree-node.component.ts:133</a></div>
1585
1613
  </td>
1586
1614
  </tr>
1587
1615
  <tr>
@@ -1713,7 +1741,11 @@ import { Node } from &quot;./tree-node.types&quot;;
1713
1741
  size&#x3D;&quot;16&quot;&gt;
1714
1742
  &lt;/svg&gt;
1715
1743
  &lt;/ng-container&gt;
1716
- &lt;ng-template *ngIf&#x3D;&quot;isTemplate(icon)&quot; [ngTemplateOutlet]&#x3D;&quot;icon&quot;&gt;&lt;/ng-template&gt;
1744
+ &lt;ng-template
1745
+ *ngIf&#x3D;&quot;isTemplate(icon)&quot;
1746
+ [ngTemplateOutlet]&#x3D;&quot;icon&quot;
1747
+ [ngTemplateOutletContext]&#x3D;&quot;{ $implicit: iconContext }&quot;&gt;
1748
+ &lt;/ng-template&gt;
1717
1749
  {{label}}
1718
1750
  &lt;/span&gt;
1719
1751
  &lt;/div&gt;
@@ -1746,6 +1778,7 @@ export class TreeNodeComponent implements AfterContentChecked, OnInit, OnDestroy
1746
1778
  @Input() selected &#x3D; false;
1747
1779
  @Input() value;
1748
1780
  @Input() icon: string | TemplateRef&lt;any&gt;;
1781
+ @Input() iconContext: any;
1749
1782
  @Input() children: Node[] &#x3D; [];
1750
1783
 
1751
1784
  /**
@@ -1771,6 +1804,7 @@ export class TreeNodeComponent implements AfterContentChecked, OnInit, OnDestroy
1771
1804
  this.selected &#x3D; node.selected ?? this.selected;
1772
1805
  this.depth &#x3D; node.depth ?? this.depth;
1773
1806
  this.children &#x3D; node.children ?? this.children;
1807
+ this.iconContext &#x3D; node.iconText ?? this.iconContext;
1774
1808
  }
1775
1809
 
1776
1810
  get node() {
@@ -1935,7 +1969,7 @@ export class TreeNodeComponent implements AfterContentChecked, OnInit, OnDestroy
1935
1969
  <script src="../js/libs/htmlparser.js"></script>
1936
1970
  <script src="../js/libs/deep-iterator.js"></script>
1937
1971
  <script>
1938
- var COMPONENT_TEMPLATE = '<div><div [id]="id" class="cds--tree-node" [ngClass]="{ \'cds--tree-node--active\': active, \'cds--tree-node--disabled\': disabled, \'cds--tree-node--selected\': selected, \'cds--tree-leaf-node\': !children.length, \'cds--tree-parent-node\': children.length, \'cds--tree-node--with-icon\': icon }" [attr.aria-expanded]="expanded || null" [attr.aria-current]="active || null" [attr.aria-selected]="disabled ? null : selected" [attr.aria-disabled]="disabled" role="treeitem" [attr.tabindex]="selected ? 0 : -1" (focus)="emitFocusEvent($event)" (blur)="emitBlurEvent($event)" (keydown)="navigateTree($event)"> <div *ngIf="!children.length" class="cds--tree-node__label" [style.padding-inline-start.rem]="offset" [style.margin-inline-start.rem]="-offset" (click)="nodeClick($event)"> <!-- Icon --> <ng-container *ngIf="icon && !isTemplate(icon)"> <svg class="cds--tree-node__icon" [cdsIcon]="icon" size="16"> </svg> </ng-container> <ng-template *ngIf="isTemplate(icon)" [ngTemplateOutlet]="icon"></ng-template> {{label}} </div> <div *ngIf="children.length" class="cds--tree-node__label" [style.padding-inline-start.rem]="offset" [style.margin-inline-start.rem]="-offset" role="group" (click)="nodeClick($event)"> <span class="cds--tree-parent-node__toggle" [attr.disabled]="disabled || null" (click)="toggleExpanded($event)"> <svg class="cds--tree-parent-node__toggle-icon" [ngClass]="{\'cds--tree-parent-node__toggle-icon--expanded\' : expanded}" ibmIcon="caret--down" size="16"> </svg> </span> <span class="cds--tree-node__label__details"> <!-- Icon --> <ng-container *ngIf="icon && !isTemplate(icon)"> <svg class="cds--tree-node__icon" [cdsIcon]="icon" size="16"> </svg> </ng-container> <ng-template *ngIf="isTemplate(icon)" [ngTemplateOutlet]="icon"></ng-template> {{label}} </span> </div> <div *ngIf="expanded" role="group" class="cds--tree-node__children"> <ng-container *ngIf="isProjected(); else notProjected"> <ng-content></ng-content> </ng-container> <ng-template #notProjected> <cds-tree-node *ngFor="let childNode of children" [node]="childNode" [depth]="depth + 1" [disabled]="disabled"> </cds-tree-node> </ng-template> </div></div> </div>'
1972
+ var COMPONENT_TEMPLATE = '<div><div [id]="id" class="cds--tree-node" [ngClass]="{ \'cds--tree-node--active\': active, \'cds--tree-node--disabled\': disabled, \'cds--tree-node--selected\': selected, \'cds--tree-leaf-node\': !children.length, \'cds--tree-parent-node\': children.length, \'cds--tree-node--with-icon\': icon }" [attr.aria-expanded]="expanded || null" [attr.aria-current]="active || null" [attr.aria-selected]="disabled ? null : selected" [attr.aria-disabled]="disabled" role="treeitem" [attr.tabindex]="selected ? 0 : -1" (focus)="emitFocusEvent($event)" (blur)="emitBlurEvent($event)" (keydown)="navigateTree($event)"> <div *ngIf="!children.length" class="cds--tree-node__label" [style.padding-inline-start.rem]="offset" [style.margin-inline-start.rem]="-offset" (click)="nodeClick($event)"> <!-- Icon --> <ng-container *ngIf="icon && !isTemplate(icon)"> <svg class="cds--tree-node__icon" [cdsIcon]="icon" size="16"> </svg> </ng-container> <ng-template *ngIf="isTemplate(icon)" [ngTemplateOutlet]="icon"></ng-template> {{label}} </div> <div *ngIf="children.length" class="cds--tree-node__label" [style.padding-inline-start.rem]="offset" [style.margin-inline-start.rem]="-offset" role="group" (click)="nodeClick($event)"> <span class="cds--tree-parent-node__toggle" [attr.disabled]="disabled || null" (click)="toggleExpanded($event)"> <svg class="cds--tree-parent-node__toggle-icon" [ngClass]="{\'cds--tree-parent-node__toggle-icon--expanded\' : expanded}" ibmIcon="caret--down" size="16"> </svg> </span> <span class="cds--tree-node__label__details"> <!-- Icon --> <ng-container *ngIf="icon && !isTemplate(icon)"> <svg class="cds--tree-node__icon" [cdsIcon]="icon" size="16"> </svg> </ng-container> <ng-template *ngIf="isTemplate(icon)" [ngTemplateOutlet]="icon" [ngTemplateOutletContext]="{ $implicit: iconContext }"> </ng-template> {{label}} </span> </div> <div *ngIf="expanded" role="group" class="cds--tree-node__children"> <ng-container *ngIf="isProjected(); else notProjected"> <ng-content></ng-content> </ng-container> <ng-template #notProjected> <cds-tree-node *ngFor="let childNode of children" [node]="childNode" [depth]="depth + 1" [disabled]="disabled"> </cds-tree-node> </ng-template> </div></div> </div>'
1939
1973
  var COMPONENTS = [{'name': 'Accordion', 'selector': 'cds-accordion, ibm-accordion'},{'name': 'AccordionItem', 'selector': 'cds-accordion-item, ibm-accordion-item'},{'name': 'ActionableNotification', 'selector': 'cds-actionable-notification, ibm-actionable-notification'},{'name': 'AlertModal', 'selector': 'cds-alert-modal, ibm-alert-modal'},{'name': 'BaseIconButton', 'selector': ''},{'name': 'BaseNotification', 'selector': ''},{'name': 'BaseTabHeader', 'selector': ''},{'name': 'Breadcrumb', 'selector': 'cds-breadcrumb, ibm-breadcrumb'},{'name': 'BreadcrumbItemComponent', 'selector': 'cds-breadcrumb-item, ibm-breadcrumb-item'},{'name': 'ButtonSet', 'selector': 'cds-button-set, ibm-button-set'},{'name': 'Checkbox', 'selector': 'cds-checkbox, ibm-checkbox'},{'name': 'ClickableTile', 'selector': 'cds-clickable-tile, ibm-clickable-tile'},{'name': 'CodeSnippet', 'selector': 'cds-code-snippet, ibm-code-snippet'},{'name': 'ComboBox', 'selector': 'cds-combo-box, ibm-combo-box'},{'name': 'ContainedList', 'selector': 'cds-contained-list, ibm-contained-list'},{'name': 'ContainedListItem', 'selector': 'cds-contained-list-item, ibm-contained-list-item'},{'name': 'ContentSwitcher', 'selector': 'cds-content-switcher, ibm-content-switcher'},{'name': 'ContextMenuComponent', 'selector': 'cds-context-menu, ibm-context-menu'},{'name': 'ContextMenuDividerComponent', 'selector': 'cds-context-menu-divider, ibm-context-menu-divider'},{'name': 'ContextMenuGroupComponent', 'selector': 'cds-context-menu-group, ibm-context-menu-group'},{'name': 'ContextMenuItemComponent', 'selector': 'cds-context-menu-item, ibm-context-menu-item'},{'name': 'DatePicker', 'selector': 'cds-date-picker, ibm-date-picker'},{'name': 'DatePickerInput', 'selector': 'cds-date-picker-input, ibm-date-picker-input'},{'name': 'Dialog', 'selector': 'cds-dialog, ibm-dialog'},{'name': 'Documentation', 'selector': 'cds-documentation'},{'name': 'Dropdown', 'selector': 'cds-dropdown, ibm-dropdown'},{'name': 'DropdownList', 'selector': 'cds-dropdown-list, ibm-dropdown-list'},{'name': 'ExpandableTile', 'selector': 'cds-expandable-tile, ibm-expandable-tile'},{'name': 'FileComponent', 'selector': 'cds-file, ibm-file'},{'name': 'FileUploader', 'selector': 'cds-file-uploader, ibm-file-uploader'},{'name': 'Hamburger', 'selector': 'cds-hamburger, ibm-hamburger'},{'name': 'Header', 'selector': 'cds-header, ibm-header'},{'name': 'HeaderAction', 'selector': 'cds-header-action, ibm-header-action'},{'name': 'HeaderGlobal', 'selector': 'cds-header-global, ibm-header-global'},{'name': 'HeaderItem', 'selector': 'cds-header-item, ibm-header-item'},{'name': 'HeaderMenu', 'selector': 'cds-header-menu, ibm-header-menu'},{'name': 'HeaderNavigation', 'selector': 'cds-header-navigation, ibm-header-navigation'},{'name': 'IconButton', 'selector': 'cds-icon-button, ibm-icon-button'},{'name': 'InlineLoading', 'selector': 'cds-inline-loading, ibm-inline-loading'},{'name': 'Label', 'selector': 'cds-label, ibm-label'},{'name': 'ListColumn', 'selector': 'cds-list-column, ibm-list-column'},{'name': 'ListHeader', 'selector': 'cds-list-header, ibm-list-header'},{'name': 'ListRow', 'selector': 'cds-list-row, ibm-list-row'},{'name': 'Loading', 'selector': 'cds-loading, ibm-loading'},{'name': 'Modal', 'selector': 'cds-modal, ibm-modal'},{'name': 'ModalFooter', 'selector': 'cds-modal-footer, ibm-modal-footer'},{'name': 'ModalHeader', 'selector': 'cds-modal-header, ibm-modal-header'},{'name': 'Notification', 'selector': 'cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification'},{'name': 'NumberComponent', 'selector': 'cds-number, ibm-number'},{'name': 'OverflowMenu', 'selector': 'cds-overflow-menu, ibm-overflow-menu'},{'name': 'OverflowMenuCustomPane', 'selector': 'cds-overflow-custom-menu-pane, ibm-overflow-custom-menu-pane'},{'name': 'OverflowMenuOption', 'selector': 'cds-overflow-menu-option, ibm-overflow-menu-option'},{'name': 'OverflowMenuPane', 'selector': 'cds-overflow-menu-pane, ibm-overflow-menu-pane'},{'name': 'Overlay', 'selector': 'cds-overlay, ibm-overlay'},{'name': 'Pagination', 'selector': 'cds-pagination, ibm-pagination'},{'name': 'PaginationNav', 'selector': 'cds-pagination-nav, ibm-pagination-navm'},{'name': 'PaginationNavItem', 'selector': 'cds-pagination-nav-item, ibm-pagination-nav-item'},{'name': 'PaginationOverflow', 'selector': 'cds-pagination-overflow, ibm-pagination-overflow'},{'name': 'Panel', 'selector': 'cds-panel, ibm-panel'},{'name': 'PasswordInputLabelComponent', 'selector': 'cds-password-label, ibm-password-label'},{'name': 'Placeholder', 'selector': 'cds-placeholder, ibm-placeholder'},{'name': 'PopoverContent', 'selector': 'cds-popover-content, ibm-popover-content'},{'name': 'ProgressBar', 'selector': 'cds-progress-bar, ibm-progress-bar'},{'name': 'ProgressIndicator', 'selector': 'cds-progress-indicator, ibm-progress-indicator'},{'name': 'Radio', 'selector': 'cds-radio, ibm-radio'},{'name': 'RadioGroup', 'selector': 'cds-radio-group, ibm-radio-group'},{'name': 'Search', 'selector': 'cds-search, ibm-search'},{'name': 'Select', 'selector': 'cds-select, ibm-select'},{'name': 'SelectionTile', 'selector': 'cds-selection-tile, ibm-selection-tile'},{'name': 'SideNav', 'selector': 'cds-sidenav, ibm-sidenav'},{'name': 'SideNavItem', 'selector': 'cds-sidenav-item, ibm-sidenav-item'},{'name': 'SideNavMenu', 'selector': 'cds-sidenav-menu, ibm-sidenav-menu'},{'name': 'SkeletonPlaceholder', 'selector': 'cds-skeleton-placeholder, ibm-skeleton-placeholder'},{'name': 'SkeletonText', 'selector': 'cds-skeleton-text, ibm-skeleton-text'},{'name': 'Slider', 'selector': 'cds-slider, ibm-slider'},{'name': 'StructuredList', 'selector': 'cds-structured-list, ibm-structured-list'},{'name': 'SwitcherList', 'selector': 'cds-switcher-list, ibm-switcher-list'},{'name': 'SwitcherListItem', 'selector': 'cds-switcher-list-item, ibm-switcher-list-item'},{'name': 'Tab', 'selector': 'cds-tab, ibm-tab'},{'name': 'TabHeaderGroup', 'selector': 'cds-tab-header-group, ibm-tab-header-group'},{'name': 'TabHeaders', 'selector': 'cds-tab-headers, ibm-tab-headers'},{'name': 'Table', 'selector': 'cds-table, ibm-table'},{'name': 'TableBody', 'selector': '[cdsTableBody], [ibmTableBody]'},{'name': 'TableCheckbox', 'selector': '[cdsTableCheckbox], [ibmTableCheckbox]'},{'name': 'TableContainer', 'selector': 'cds-table-container, ibm-table-container'},{'name': 'TableData', 'selector': '[cdsTableData], [ibmTableData]'},{'name': 'TableExpandButton', 'selector': '[cdsTableExpandButton], [ibmTableExpandButton]'},{'name': 'TableExpandedRow', 'selector': '[cdsTableExpandedRow], [ibmTableExpandedRow]'},{'name': 'TableHead', 'selector': '[cdsTableHead], [ibmTableHead]'},{'name': 'TableHeadCell', 'selector': '[cdsTableHeadCell], [ibmTableHeadCell]'},{'name': 'TableHeadCheckbox', 'selector': '[cdsTableHeadCheckbox], [ibmTableHeadCheckbox]'},{'name': 'TableHeader', 'selector': 'cds-table-header, ibm-table-header'},{'name': 'TableHeadExpand', 'selector': '[cdsTableHeadExpand], [ibmTableHeadExpand]'},{'name': 'TableRadio', 'selector': '[cdsTableRadio], [ibmTableRadio]'},{'name': 'TableRowComponent', 'selector': '[cdsTableRow], [ibmTableRow]'},{'name': 'TableToolbar', 'selector': 'cds-table-toolbar, ibm-table-toolbar'},{'name': 'TableToolbarActions', 'selector': 'cds-table-toolbar-actions, ibm-table-toolbar-actions'},{'name': 'TableToolbarContent', 'selector': 'cds-table-toolbar-content, ibm-table-toolbar-content'},{'name': 'TableToolbarSearch', 'selector': 'cds-table-toolbar-search, ibm-table-toolbar-search'},{'name': 'Tabs', 'selector': 'cds-tabs, ibm-tabs'},{'name': 'TabSkeleton', 'selector': 'cds-tabs-skeleton, ibm-tabs-skeleton'},{'name': 'Tag', 'selector': 'cds-tag, ibm-tag'},{'name': 'TagFilter', 'selector': 'cds-tag-filter, ibm-tag-filter'},{'name': 'TextareaLabelComponent', 'selector': 'cds-textarea-label, ibm-textarea-label'},{'name': 'TextInputLabelComponent', 'selector': 'cds-text-label, ibm-text-label'},{'name': 'Tile', 'selector': 'cds-tile, ibm-tile'},{'name': 'TileGroup', 'selector': 'cds-tile-group, ibm-tile-group'},{'name': 'TimePicker', 'selector': 'cds-timepicker, ibm-timepicker'},{'name': 'TimePickerSelect', 'selector': 'cds-timepicker-select, ibm-timepicker-select'},{'name': 'Toast', 'selector': 'cds-toast, ibm-toast'},{'name': 'Toggle', 'selector': 'cds-toggle, ibm-toggle'},{'name': 'Toggletip', 'selector': 'cds-toggletip, ibm-toggletip'},{'name': 'Tooltip', 'selector': 'cds-tooltip, ibm-tooltip'},{'name': 'TooltipDefinition', 'selector': 'cds-tooltip-definition, ibm-tooltip-definition'},{'name': 'TreeNodeComponent', 'selector': 'cds-tree-node'},{'name': 'TreeViewComponent', 'selector': 'cds-tree-view'}];
1940
1974
  var DIRECTIVES = [{'name': 'AbstractDropdownView', 'selector': '[cdsAbstractDropdownView], [ibmAbstractDropdownView]'},{'name': 'ActionableButton', 'selector': '[cdsActionableButton], [ibmActionableButton]'},{'name': 'ActionableSubtitle', 'selector': '[cdsActionableSubtitle], [ibmActionableSubtitle]'},{'name': 'ActionableTitle', 'selector': '[cdsActionableTitle], [ibmActionableTitle]'},{'name': 'BaseModal', 'selector': '[cdsBaseModal], [ibmBaseModal]'},{'name': 'Button', 'selector': '[cdsButton], [ibmButton]'},{'name': 'ColumnDirective', 'selector': '[cdsCol], [ibmCol]'},{'name': 'ContentSwitcherOption', 'selector': '[cdsContentOption], [ibmContentOption]'},{'name': 'DialogDirective', 'selector': '[cdsDialog], [ibmDialog]'},{'name': 'ExpandableTileAboveFoldDirective', 'selector': '[cdsAboveFold], [ibmAboveFold]'},{'name': 'ExpandableTileBelowFoldDirective', 'selector': '[cdsBelowFold], [ibmBelowFold]'},{'name': 'ExpandedRowHover', 'selector': '[cdsExpandedRowHover], [ibmExpandedRowHover]'},{'name': 'GridDirective', 'selector': '[cdsGrid], [ibmGrid]'},{'name': 'IconDirective', 'selector': '[cdsIcon], [ibmIcon]'},{'name': 'LayerDirective', 'selector': '[cdsLayer], [ibmLayer]'},{'name': 'Link', 'selector': '[cdsLink], [ibmLink]'},{'name': 'List', 'selector': '[cdsList], [ibmList]'},{'name': 'ListItemDirective', 'selector': '[cdsListItem], [ibmListItem]'},{'name': 'ModalContent', 'selector': '[cdsModalContent], [ibmModalContent]'},{'name': 'ModalContentText', 'selector': '[cdsModalContentText], [ibmModalContentText]'},{'name': 'ModalHeaderHeading', 'selector': '[cdsModalHeaderHeading], [ibmModalHeaderHeading]'},{'name': 'ModalHeaderLabel', 'selector': '[cdsModalHeaderLabel], [ibmModalHeaderLabel]'},{'name': 'NotificationSubtitle', 'selector': '[cdsNotificationSubtitle], [ibmNotificationSubtitle]'},{'name': 'NotificationTitle', 'selector': '[cdsNotificationTitle], [ibmNotificationTitle]'},{'name': 'OptGroup', 'selector': 'optgroup'},{'name': 'Option', 'selector': 'option'},{'name': 'OverflowMenuDirective', 'selector': '[cdsOverflowMenu], [ibmOverflowMenu]'},{'name': 'PasswordInput', 'selector': '[cdsPassword], [ibmPassword]'},{'name': 'PopoverContainer', 'selector': '[cdsPopover], [ibmPopover]'},{'name': 'RowDirective', 'selector': '[cdsRow], [ibmRow]'},{'name': 'ScrollableList', 'selector': '[cdsScrollableList], [ibmScrollableList]'},{'name': 'StackDirective', 'selector': '[cdsStack], [ibmStack]'},{'name': 'TabHeader', 'selector': '[cdsTabHeader], [ibmTabHeader]'},{'name': 'TableDirective', 'selector': '[cdsTable], [ibmTable]'},{'name': 'TableHeadCellLabel', 'selector': '[cdsTableHeadCellLabel], [ibmTableHeadCellLabel]'},{'name': 'TableHeaderDescription', 'selector': '[cdsTableHeaderDescription], [ibmTableHeaderDescription]'},{'name': 'TableHeaderTitle', 'selector': '[cdsTableHeaderTitle], [ibmTableHeaderTitle]'},{'name': 'TextArea', 'selector': '[cdsTextArea], [ibmTextArea]'},{'name': 'TextInput', 'selector': '[cdsText], [ibmText]'},{'name': 'ThemeDirective', 'selector': '[cdsTheme], [ibmTheme]'},{'name': 'ToastCaption', 'selector': '[cdsToastCaption], [ibmToastCaption]'},{'name': 'ToastSubtitle', 'selector': '[cdsToastSubtitle], [ibmToastSubtitle]'},{'name': 'ToastTitle', 'selector': '[cdsToastTitle], [ibmToastTitle]'},{'name': 'ToggletipAction', 'selector': '[cdsToggletipAction], [ibmToggletipAction]'},{'name': 'ToggletipButton', 'selector': '[cdsToggletipButton], [ibmToggletipButton]'},{'name': 'ToggletipContent', 'selector': '[cdsToggletipContent], [ibmToggletipContent]'},{'name': 'ToggletipLabel', 'selector': '[cdsToggletipLabel], [ibmToggletipLabel]'}];
1941
1975
  var ACTUAL_COMPONENT = {'name': 'TreeNodeComponent'};