carbon-components-angular 5.59.1 → 5.60.0

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 (52) hide show
  1. package/docs/documentation/components/FileComponent.html +244 -57
  2. package/docs/documentation/components/FileUploader.html +125 -53
  3. package/docs/documentation/components/TooltipDefinition.html +176 -38
  4. package/docs/documentation/coverage.html +9 -9
  5. package/docs/documentation/js/search/search_index.js +2 -2
  6. package/docs/documentation/modules/ThemeModule/dependencies.svg +4 -4
  7. package/docs/documentation/modules/ThemeModule.html +4 -4
  8. package/docs/documentation/modules/TilesModule/dependencies.svg +106 -106
  9. package/docs/documentation/modules/TilesModule.html +106 -106
  10. package/docs/documentation/modules/TimePickerModule/dependencies.svg +40 -44
  11. package/docs/documentation/modules/TimePickerModule.html +40 -44
  12. package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +21 -21
  13. package/docs/documentation/modules/TimePickerSelectModule.html +21 -21
  14. package/docs/documentation/modules/ToggleModule/dependencies.svg +42 -46
  15. package/docs/documentation/modules/ToggleModule.html +42 -46
  16. package/docs/documentation/modules/ToggletipModule/dependencies.svg +37 -37
  17. package/docs/documentation/modules/ToggletipModule.html +37 -37
  18. package/docs/documentation/modules/TooltipModule/dependencies.svg +29 -29
  19. package/docs/documentation/modules/TooltipModule.html +29 -29
  20. package/docs/documentation/modules/TreeviewModule/dependencies.svg +34 -34
  21. package/docs/documentation/modules/TreeviewModule.html +34 -34
  22. package/docs/documentation.json +735 -140
  23. package/docs/storybook/1335.04cb3625.iframe.bundle.js +1 -0
  24. package/docs/storybook/{6702.8fcd135f.iframe.bundle.js → 6702.a0e549d4.iframe.bundle.js} +1 -1
  25. package/docs/storybook/file-uploader-file-stories.28293d0d.iframe.bundle.js +1 -0
  26. package/docs/storybook/file-uploader-file-uploader-stories.fa3bd098.iframe.bundle.js +1 -0
  27. package/docs/storybook/iframe.html +2 -2
  28. package/docs/storybook/index.json +1 -1
  29. package/docs/storybook/main.css +2137 -697
  30. package/docs/storybook/main.eff7657a.iframe.bundle.js +1 -0
  31. package/docs/storybook/project.json +1 -1
  32. package/docs/storybook/runtime~main.4bbe449f.iframe.bundle.js +1 -0
  33. package/docs/storybook/stories.json +1 -1
  34. package/docs/storybook/{tooltip-definition-tooptip-stories.16c9af6d.iframe.bundle.js → tooltip-definition-tooptip-stories.9a2a5436.iframe.bundle.js} +1 -1
  35. package/esm2020/file-uploader/file-uploader.component.mjs +15 -7
  36. package/esm2020/file-uploader/file.component.mjs +92 -42
  37. package/esm2020/tooltip/definition-tooptip.component.mjs +26 -7
  38. package/fesm2015/carbon-components-angular-file-uploader.mjs +105 -48
  39. package/fesm2015/carbon-components-angular-file-uploader.mjs.map +1 -1
  40. package/fesm2015/carbon-components-angular-tooltip.mjs +25 -6
  41. package/fesm2015/carbon-components-angular-tooltip.mjs.map +1 -1
  42. package/fesm2020/carbon-components-angular-file-uploader.mjs +105 -48
  43. package/fesm2020/carbon-components-angular-file-uploader.mjs.map +1 -1
  44. package/fesm2020/carbon-components-angular-tooltip.mjs +25 -6
  45. package/fesm2020/carbon-components-angular-tooltip.mjs.map +1 -1
  46. package/file-uploader/file-uploader.component.d.ts +9 -1
  47. package/file-uploader/file.component.d.ts +11 -2
  48. package/package.json +1 -1
  49. package/tooltip/definition-tooptip.component.d.ts +7 -1
  50. package/docs/storybook/file-uploader-file-uploader-stories.7cbeda49.iframe.bundle.js +0 -1
  51. package/docs/storybook/main.f6ef3c2c.iframe.bundle.js +0 -1
  52. package/docs/storybook/runtime~main.5de03212.iframe.bundle.js +0 -1
@@ -233,8 +233,10 @@
233
233
  <ng-container *ngFor="let fileItem of files">
234
234
  <cds-file
235
235
  [fileItem]="fileItem"
236
- (remove)="removeFile(fileItem)"
237
- [size]="fileItemSize">
236
+ [nameTpl]="fileNameTpl"
237
+ [actionsTpl]="fileActionsTpl"
238
+ [size]="fileItemSize"
239
+ (remove)="removeFile(fileItem)">
238
240
  </cds-file>
239
241
  </ng-container>
240
242
  </div>
@@ -375,9 +377,15 @@
375
377
  <li>
376
378
  <a href="#dropText" >dropText</a>
377
379
  </li>
380
+ <li>
381
+ <a href="#fileActionsTpl" >fileActionsTpl</a>
382
+ </li>
378
383
  <li>
379
384
  <a href="#fileItemSize" >fileItemSize</a>
380
385
  </li>
386
+ <li>
387
+ <a href="#fileNameTpl" >fileNameTpl</a>
388
+ </li>
381
389
  <li>
382
390
  <a href="#files" >files</a>
383
391
  </li>
@@ -449,7 +457,7 @@
449
457
  </tr>
450
458
  <tr>
451
459
  <td class="col-md-4">
452
- <div class="io-line">Defined in <a href="" data-line="176" class="link-to-prism">src/file-uploader/file-uploader.component.ts:176</a></div>
460
+ <div class="io-line">Defined in <a href="" data-line="186" class="link-to-prism">src/file-uploader/file-uploader.component.ts:186</a></div>
453
461
  </td>
454
462
  </tr>
455
463
 
@@ -510,7 +518,7 @@
510
518
  </tr>
511
519
  <tr>
512
520
  <td class="col-md-2" colspan="2">
513
- <div class="io-line">Defined in <a href="" data-line="124" class="link-to-prism">src/file-uploader/file-uploader.component.ts:124</a></div>
521
+ <div class="io-line">Defined in <a href="" data-line="126" class="link-to-prism">src/file-uploader/file-uploader.component.ts:126</a></div>
514
522
  </td>
515
523
  </tr>
516
524
  <tr>
@@ -542,7 +550,7 @@
542
550
  </tr>
543
551
  <tr>
544
552
  <td class="col-md-2" colspan="2">
545
- <div class="io-line">Defined in <a href="" data-line="108" class="link-to-prism">src/file-uploader/file-uploader.component.ts:108</a></div>
553
+ <div class="io-line">Defined in <a href="" data-line="110" class="link-to-prism">src/file-uploader/file-uploader.component.ts:110</a></div>
546
554
  </td>
547
555
  </tr>
548
556
  <tr>
@@ -575,7 +583,7 @@
575
583
  </tr>
576
584
  <tr>
577
585
  <td class="col-md-2" colspan="2">
578
- <div class="io-line">Defined in <a href="" data-line="112" class="link-to-prism">src/file-uploader/file-uploader.component.ts:112</a></div>
586
+ <div class="io-line">Defined in <a href="" data-line="114" class="link-to-prism">src/file-uploader/file-uploader.component.ts:114</a></div>
579
587
  </td>
580
588
  </tr>
581
589
  <tr>
@@ -602,7 +610,7 @@
602
610
  </tr>
603
611
  <tr>
604
612
  <td class="col-md-2" colspan="2">
605
- <div class="io-line">Defined in <a href="" data-line="120" class="link-to-prism">src/file-uploader/file-uploader.component.ts:120</a></div>
613
+ <div class="io-line">Defined in <a href="" data-line="122" class="link-to-prism">src/file-uploader/file-uploader.component.ts:122</a></div>
606
614
  </td>
607
615
  </tr>
608
616
  <tr>
@@ -634,7 +642,7 @@
634
642
  </tr>
635
643
  <tr>
636
644
  <td class="col-md-2" colspan="2">
637
- <div class="io-line">Defined in <a href="" data-line="166" class="link-to-prism">src/file-uploader/file-uploader.component.ts:166</a></div>
645
+ <div class="io-line">Defined in <a href="" data-line="168" class="link-to-prism">src/file-uploader/file-uploader.component.ts:168</a></div>
638
646
  </td>
639
647
  </tr>
640
648
  <tr>
@@ -666,7 +674,7 @@
666
674
  </tr>
667
675
  <tr>
668
676
  <td class="col-md-2" colspan="2">
669
- <div class="io-line">Defined in <a href="" data-line="146" class="link-to-prism">src/file-uploader/file-uploader.component.ts:146</a></div>
677
+ <div class="io-line">Defined in <a href="" data-line="148" class="link-to-prism">src/file-uploader/file-uploader.component.ts:148</a></div>
670
678
  </td>
671
679
  </tr>
672
680
  <tr>
@@ -693,12 +701,39 @@
693
701
  </tr>
694
702
  <tr>
695
703
  <td class="col-md-2" colspan="2">
696
- <div class="io-line">Defined in <a href="" data-line="150" class="link-to-prism">src/file-uploader/file-uploader.component.ts:150</a></div>
704
+ <div class="io-line">Defined in <a href="" data-line="152" class="link-to-prism">src/file-uploader/file-uploader.component.ts:152</a></div>
697
705
  </td>
698
706
  </tr>
699
707
  <tr>
700
708
  <td class="col-md-4">
701
709
  <div class="io-description"><p>Sets the text shown in drag and drop box.</p>
710
+ </div>
711
+ </td>
712
+ </tr>
713
+ </tbody>
714
+ </table>
715
+ <table class="table table-sm table-bordered">
716
+ <tbody>
717
+ <tr>
718
+ <td class="col-md-4">
719
+ <a name="fileActionsTpl"></a>
720
+ <b>fileActionsTpl</b>
721
+ </td>
722
+ </tr>
723
+ <tr>
724
+ <td class="col-md-4">
725
+ <i>Type : </i> <code>TemplateRef&lt;&gt;</code>
726
+
727
+ </td>
728
+ </tr>
729
+ <tr>
730
+ <td class="col-md-2" colspan="2">
731
+ <div class="io-line">Defined in <a href="" data-line="176" class="link-to-prism">src/file-uploader/file-uploader.component.ts:176</a></div>
732
+ </td>
733
+ </tr>
734
+ <tr>
735
+ <td class="col-md-4">
736
+ <div class="io-description"><p>Custom template used to render the file actions of uploaded files</p>
702
737
  </div>
703
738
  </td>
704
739
  </tr>
@@ -725,12 +760,39 @@
725
760
  </tr>
726
761
  <tr>
727
762
  <td class="col-md-2" colspan="2">
728
- <div class="io-line">Defined in <a href="" data-line="142" class="link-to-prism">src/file-uploader/file-uploader.component.ts:142</a></div>
763
+ <div class="io-line">Defined in <a href="" data-line="144" class="link-to-prism">src/file-uploader/file-uploader.component.ts:144</a></div>
729
764
  </td>
730
765
  </tr>
731
766
  <tr>
732
767
  <td class="col-md-4">
733
768
  <div class="io-description"><p>Sets the size of the file items</p>
769
+ </div>
770
+ </td>
771
+ </tr>
772
+ </tbody>
773
+ </table>
774
+ <table class="table table-sm table-bordered">
775
+ <tbody>
776
+ <tr>
777
+ <td class="col-md-4">
778
+ <a name="fileNameTpl"></a>
779
+ <b>fileNameTpl</b>
780
+ </td>
781
+ </tr>
782
+ <tr>
783
+ <td class="col-md-4">
784
+ <i>Type : </i> <code>TemplateRef&lt;&gt;</code>
785
+
786
+ </td>
787
+ </tr>
788
+ <tr>
789
+ <td class="col-md-2" colspan="2">
790
+ <div class="io-line">Defined in <a href="" data-line="172" class="link-to-prism">src/file-uploader/file-uploader.component.ts:172</a></div>
791
+ </td>
792
+ </tr>
793
+ <tr>
794
+ <td class="col-md-4">
795
+ <div class="io-description"><p>Custom template used to render the file name of uploaded files</p>
734
796
  </div>
735
797
  </td>
736
798
  </tr>
@@ -757,7 +819,7 @@
757
819
  </tr>
758
820
  <tr>
759
821
  <td class="col-md-2" colspan="2">
760
- <div class="io-line">Defined in <a href="" data-line="162" class="link-to-prism">src/file-uploader/file-uploader.component.ts:162</a></div>
822
+ <div class="io-line">Defined in <a href="" data-line="164" class="link-to-prism">src/file-uploader/file-uploader.component.ts:164</a></div>
761
823
  </td>
762
824
  </tr>
763
825
  <tr>
@@ -789,7 +851,7 @@
789
851
  </tr>
790
852
  <tr>
791
853
  <td class="col-md-2" colspan="2">
792
- <div class="io-line">Defined in <a href="" data-line="154" class="link-to-prism">src/file-uploader/file-uploader.component.ts:154</a></div>
854
+ <div class="io-line">Defined in <a href="" data-line="156" class="link-to-prism">src/file-uploader/file-uploader.component.ts:156</a></div>
793
855
  </td>
794
856
  </tr>
795
857
  <tr>
@@ -821,7 +883,7 @@
821
883
  </tr>
822
884
  <tr>
823
885
  <td class="col-md-2" colspan="2">
824
- <div class="io-line">Defined in <a href="" data-line="130" class="link-to-prism">src/file-uploader/file-uploader.component.ts:130</a></div>
886
+ <div class="io-line">Defined in <a href="" data-line="132" class="link-to-prism">src/file-uploader/file-uploader.component.ts:132</a></div>
825
887
  </td>
826
888
  </tr>
827
889
  <tr>
@@ -849,7 +911,7 @@
849
911
  </tr>
850
912
  <tr>
851
913
  <td class="col-md-2" colspan="2">
852
- <div class="io-line">Defined in <a href="" data-line="138" class="link-to-prism">src/file-uploader/file-uploader.component.ts:138</a></div>
914
+ <div class="io-line">Defined in <a href="" data-line="140" class="link-to-prism">src/file-uploader/file-uploader.component.ts:140</a></div>
853
915
  </td>
854
916
  </tr>
855
917
  <tr>
@@ -881,7 +943,7 @@
881
943
  </tr>
882
944
  <tr>
883
945
  <td class="col-md-2" colspan="2">
884
- <div class="io-line">Defined in <a href="" data-line="134" class="link-to-prism">src/file-uploader/file-uploader.component.ts:134</a></div>
946
+ <div class="io-line">Defined in <a href="" data-line="136" class="link-to-prism">src/file-uploader/file-uploader.component.ts:136</a></div>
885
947
  </td>
886
948
  </tr>
887
949
  <tr>
@@ -908,7 +970,7 @@
908
970
  </tr>
909
971
  <tr>
910
972
  <td class="col-md-2" colspan="2">
911
- <div class="io-line">Defined in <a href="" data-line="116" class="link-to-prism">src/file-uploader/file-uploader.component.ts:116</a></div>
973
+ <div class="io-line">Defined in <a href="" data-line="118" class="link-to-prism">src/file-uploader/file-uploader.component.ts:118</a></div>
912
974
  </td>
913
975
  </tr>
914
976
  <tr>
@@ -938,7 +1000,7 @@
938
1000
  </tr>
939
1001
  <tr>
940
1002
  <td class="col-md-2" colspan="2">
941
- <div class="io-line">Defined in <a href="" data-line="168" class="link-to-prism">src/file-uploader/file-uploader.component.ts:168</a></div>
1003
+ <div class="io-line">Defined in <a href="" data-line="178" class="link-to-prism">src/file-uploader/file-uploader.component.ts:178</a></div>
942
1004
  </td>
943
1005
  </tr>
944
1006
  </tbody>
@@ -971,8 +1033,8 @@
971
1033
 
972
1034
  <tr>
973
1035
  <td class="col-md-4">
974
- <div class="io-line">Defined in <a href="" data-line="213"
975
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:213</a></div>
1036
+ <div class="io-line">Defined in <a href="" data-line="223"
1037
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:223</a></div>
976
1038
  </td>
977
1039
  </tr>
978
1040
 
@@ -1036,8 +1098,8 @@
1036
1098
 
1037
1099
  <tr>
1038
1100
  <td class="col-md-4">
1039
- <div class="io-line">Defined in <a href="" data-line="292"
1040
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:292</a></div>
1101
+ <div class="io-line">Defined in <a href="" data-line="302"
1102
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:302</a></div>
1041
1103
  </td>
1042
1104
  </tr>
1043
1105
 
@@ -1099,8 +1161,8 @@
1099
1161
 
1100
1162
  <tr>
1101
1163
  <td class="col-md-4">
1102
- <div class="io-line">Defined in <a href="" data-line="196"
1103
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:196</a></div>
1164
+ <div class="io-line">Defined in <a href="" data-line="206"
1165
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:206</a></div>
1104
1166
  </td>
1105
1167
  </tr>
1106
1168
 
@@ -1136,8 +1198,8 @@
1136
1198
 
1137
1199
  <tr>
1138
1200
  <td class="col-md-4">
1139
- <div class="io-line">Defined in <a href="" data-line="246"
1140
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:246</a></div>
1201
+ <div class="io-line">Defined in <a href="" data-line="256"
1202
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:256</a></div>
1141
1203
  </td>
1142
1204
  </tr>
1143
1205
 
@@ -1199,8 +1261,8 @@
1199
1261
 
1200
1262
  <tr>
1201
1263
  <td class="col-md-4">
1202
- <div class="io-line">Defined in <a href="" data-line="237"
1203
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:237</a></div>
1264
+ <div class="io-line">Defined in <a href="" data-line="247"
1265
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:247</a></div>
1204
1266
  </td>
1205
1267
  </tr>
1206
1268
 
@@ -1262,8 +1324,8 @@
1262
1324
 
1263
1325
  <tr>
1264
1326
  <td class="col-md-4">
1265
- <div class="io-line">Defined in <a href="" data-line="252"
1266
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:252</a></div>
1327
+ <div class="io-line">Defined in <a href="" data-line="262"
1328
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:262</a></div>
1267
1329
  </td>
1268
1330
  </tr>
1269
1331
 
@@ -1325,8 +1387,8 @@
1325
1387
 
1326
1388
  <tr>
1327
1389
  <td class="col-md-4">
1328
- <div class="io-line">Defined in <a href="" data-line="223"
1329
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:223</a></div>
1390
+ <div class="io-line">Defined in <a href="" data-line="233"
1391
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:233</a></div>
1330
1392
  </td>
1331
1393
  </tr>
1332
1394
 
@@ -1362,8 +1424,8 @@
1362
1424
 
1363
1425
  <tr>
1364
1426
  <td class="col-md-4">
1365
- <div class="io-line">Defined in <a href="" data-line="305"
1366
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:305</a></div>
1427
+ <div class="io-line">Defined in <a href="" data-line="315"
1428
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:315</a></div>
1367
1429
  </td>
1368
1430
  </tr>
1369
1431
 
@@ -1431,8 +1493,8 @@
1431
1493
 
1432
1494
  <tr>
1433
1495
  <td class="col-md-4">
1434
- <div class="io-line">Defined in <a href="" data-line="299"
1435
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:299</a></div>
1496
+ <div class="io-line">Defined in <a href="" data-line="309"
1497
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:309</a></div>
1436
1498
  </td>
1437
1499
  </tr>
1438
1500
 
@@ -1500,8 +1562,8 @@
1500
1562
 
1501
1563
  <tr>
1502
1564
  <td class="col-md-4">
1503
- <div class="io-line">Defined in <a href="" data-line="279"
1504
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:279</a></div>
1565
+ <div class="io-line">Defined in <a href="" data-line="289"
1566
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:289</a></div>
1505
1567
  </td>
1506
1568
  </tr>
1507
1569
 
@@ -1563,8 +1625,8 @@
1563
1625
 
1564
1626
  <tr>
1565
1627
  <td class="col-md-4">
1566
- <div class="io-line">Defined in <a href="" data-line="316"
1567
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:316</a></div>
1628
+ <div class="io-line">Defined in <a href="" data-line="326"
1629
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:326</a></div>
1568
1630
  </td>
1569
1631
  </tr>
1570
1632
 
@@ -1638,8 +1700,8 @@
1638
1700
 
1639
1701
  <tr>
1640
1702
  <td class="col-md-4">
1641
- <div class="io-line">Defined in <a href="" data-line="207"
1642
- class="link-to-prism">src/file-uploader/file-uploader.component.ts:207</a></div>
1703
+ <div class="io-line">Defined in <a href="" data-line="217"
1704
+ class="link-to-prism">src/file-uploader/file-uploader.component.ts:217</a></div>
1643
1705
  </td>
1644
1706
  </tr>
1645
1707
 
@@ -1712,7 +1774,7 @@
1712
1774
  </tr>
1713
1775
  <tr>
1714
1776
  <td class="col-md-4">
1715
- <div class="io-line">Defined in <a href="" data-line="173" class="link-to-prism">src/file-uploader/file-uploader.component.ts:173</a></div>
1777
+ <div class="io-line">Defined in <a href="" data-line="183" class="link-to-prism">src/file-uploader/file-uploader.component.ts:183</a></div>
1716
1778
  </td>
1717
1779
  </tr>
1718
1780
 
@@ -1748,7 +1810,7 @@
1748
1810
  </tr>
1749
1811
  <tr>
1750
1812
  <td class="col-md-4">
1751
- <div class="io-line">Defined in <a href="" data-line="158" class="link-to-prism">src/file-uploader/file-uploader.component.ts:158</a></div>
1813
+ <div class="io-line">Defined in <a href="" data-line="160" class="link-to-prism">src/file-uploader/file-uploader.component.ts:160</a></div>
1752
1814
  </td>
1753
1815
  </tr>
1754
1816
 
@@ -1786,7 +1848,7 @@
1786
1848
  </tr>
1787
1849
  <tr>
1788
1850
  <td class="col-md-4">
1789
- <div class="io-line">Defined in <a href="" data-line="102" class="link-to-prism">src/file-uploader/file-uploader.component.ts:102</a></div>
1851
+ <div class="io-line">Defined in <a href="" data-line="104" class="link-to-prism">src/file-uploader/file-uploader.component.ts:104</a></div>
1790
1852
  </td>
1791
1853
  </tr>
1792
1854
 
@@ -1824,7 +1886,7 @@
1824
1886
  </tr>
1825
1887
  <tr>
1826
1888
  <td class="col-md-4">
1827
- <div class="io-line">Defined in <a href="" data-line="176" class="link-to-prism">src/file-uploader/file-uploader.component.ts:176</a></div>
1889
+ <div class="io-line">Defined in <a href="" data-line="186" class="link-to-prism">src/file-uploader/file-uploader.component.ts:186</a></div>
1828
1890
  </td>
1829
1891
  </tr>
1830
1892
 
@@ -1856,7 +1918,7 @@
1856
1918
  </tr>
1857
1919
  <tr>
1858
1920
  <td class="col-md-4">
1859
- <div class="io-line">Defined in <a href="" data-line="175" class="link-to-prism">src/file-uploader/file-uploader.component.ts:175</a></div>
1921
+ <div class="io-line">Defined in <a href="" data-line="185" class="link-to-prism">src/file-uploader/file-uploader.component.ts:185</a></div>
1860
1922
  </td>
1861
1923
  </tr>
1862
1924
 
@@ -1885,7 +1947,7 @@
1885
1947
  </tr>
1886
1948
  <tr>
1887
1949
  <td class="col-md-4">
1888
- <div class="io-line">Defined in <a href="" data-line="186" class="link-to-prism">src/file-uploader/file-uploader.component.ts:186</a></div>
1950
+ <div class="io-line">Defined in <a href="" data-line="196" class="link-to-prism">src/file-uploader/file-uploader.component.ts:196</a></div>
1889
1951
  </td>
1890
1952
  </tr>
1891
1953
  <tr>
@@ -1908,7 +1970,7 @@ Updates <code>this.files</code>.</p>
1908
1970
  </tr>
1909
1971
  <tr>
1910
1972
  <td class="col-md-4">
1911
- <div class="io-line">Defined in <a href="" data-line="189" class="link-to-prism">src/file-uploader/file-uploader.component.ts:189</a></div>
1973
+ <div class="io-line">Defined in <a href="" data-line="199" class="link-to-prism">src/file-uploader/file-uploader.component.ts:199</a></div>
1912
1974
  </td>
1913
1975
  </tr>
1914
1976
  <tr>
@@ -1966,7 +2028,7 @@ Updates <code>this.files</code>.</p>
1966
2028
  </tr>
1967
2029
  <tr>
1968
2030
  <td class="col-md-4">
1969
- <div class="io-line">Defined in <a href="" data-line="200" class="link-to-prism">src/file-uploader/file-uploader.component.ts:200</a></div>
2031
+ <div class="io-line">Defined in <a href="" data-line="210" class="link-to-prism">src/file-uploader/file-uploader.component.ts:210</a></div>
1970
2032
  </td>
1971
2033
  </tr>
1972
2034
 
@@ -2052,8 +2114,10 @@ const noop &#x3D; () &#x3D;&gt; { };
2052
2114
  &lt;ng-container *ngFor&#x3D;&quot;let fileItem of files&quot;&gt;
2053
2115
  &lt;cds-file
2054
2116
  [fileItem]&#x3D;&quot;fileItem&quot;
2055
- (remove)&#x3D;&quot;removeFile(fileItem)&quot;
2056
- [size]&#x3D;&quot;fileItemSize&quot;&gt;
2117
+ [nameTpl]&#x3D;&quot;fileNameTpl&quot;
2118
+ [actionsTpl]&#x3D;&quot;fileActionsTpl&quot;
2119
+ [size]&#x3D;&quot;fileItemSize&quot;
2120
+ (remove)&#x3D;&quot;removeFile(fileItem)&quot;&gt;
2057
2121
  &lt;/cds-file&gt;
2058
2122
  &lt;/ng-container&gt;
2059
2123
  &lt;/div&gt;
@@ -2143,6 +2207,14 @@ export class FileUploader implements ControlValueAccessor {
2143
2207
  * Set to &#x60;true&#x60; to disable upload button
2144
2208
  */
2145
2209
  @Input() disabled &#x3D; false;
2210
+ /**
2211
+ * Custom template used to render the file name of uploaded files
2212
+ */
2213
+ @Input() fileNameTpl: TemplateRef&lt;unknown&gt;;
2214
+ /**
2215
+ * Custom template used to render the file actions of uploaded files
2216
+ */
2217
+ @Input() fileActionsTpl: TemplateRef&lt;unknown&gt;;
2146
2218
 
2147
2219
  @Output() filesChange &#x3D; new EventEmitter&lt;any&gt;();
2148
2220
 
@@ -2326,7 +2398,7 @@ export class FileUploader implements ControlValueAccessor {
2326
2398
  <script src="../js/libs/htmlparser.js"></script>
2327
2399
  <script src="../js/libs/deep-iterator.js"></script>
2328
2400
  <script>
2329
- var COMPONENT_TEMPLATE = '<div><ng-container *ngIf="!skeleton; else skeletonTemplate"> <label [for]="fileUploaderId" class="cds--file--label">{{title}}</label> <p class="cds--label-description" role="alert">{{description}}</p> <div class="cds--file"> <label *ngIf="drop" class="cds--file-browse-btn" (keyup.enter)="fileInput.click()" (keyup.space)="fileInput.click()" [ngClass]="{\'cds--file-browse-btn--disabled\': disabled}" tabindex="0"> <div class="cds--file__drop-container" [ngClass]="{\'cds--file__drop-container--drag-over\': dragOver}" role="button" (click)="fileInput.click()" [attr.for]="fileUploaderId" (dragover)="onDragOver($event)" (dragleave)="onDragLeave($event)" (drop)="onDrop($event)"> <ng-container *ngIf="!isTemplate(dropText)">{{dropText}}</ng-container> <ng-template *ngIf="isTemplate(dropText)" [ngTemplateOutlet]="dropText"></ng-template> </div> </label> <button *ngIf="!drop" type="button" [cdsButton]="buttonType" (click)="fileInput.click()" [attr.for]="fileUploaderId" [size]="size" [disabled]="disabled"> {{buttonText}} </button> <input #fileInput type="file" class="cds--file-input" [accept]="accept" [id]="fileUploaderId" [multiple]="multiple" tabindex="-1" (change)="onFilesAdded()" [disabled]="disabled"/> <div class="cds--file-container"> <ng-container *ngFor="let fileItem of files"> <cds-file [fileItem]="fileItem" (remove)="removeFile(fileItem)" [size]="fileItemSize"> </cds-file> </ng-container> </div> </div></ng-container><ng-template #skeletonTemplate> <div class="cds--skeleton__text" style="width: 100px"></div> <div class="cds--skeleton__text" style="width: 225px"></div> <button cdsButton skeleton="true"></button></ng-template> </div>'
2401
+ var COMPONENT_TEMPLATE = '<div><ng-container *ngIf="!skeleton; else skeletonTemplate"> <label [for]="fileUploaderId" class="cds--file--label">{{title}}</label> <p class="cds--label-description" role="alert">{{description}}</p> <div class="cds--file"> <label *ngIf="drop" class="cds--file-browse-btn" (keyup.enter)="fileInput.click()" (keyup.space)="fileInput.click()" [ngClass]="{\'cds--file-browse-btn--disabled\': disabled}" tabindex="0"> <div class="cds--file__drop-container" [ngClass]="{\'cds--file__drop-container--drag-over\': dragOver}" role="button" (click)="fileInput.click()" [attr.for]="fileUploaderId" (dragover)="onDragOver($event)" (dragleave)="onDragLeave($event)" (drop)="onDrop($event)"> <ng-container *ngIf="!isTemplate(dropText)">{{dropText}}</ng-container> <ng-template *ngIf="isTemplate(dropText)" [ngTemplateOutlet]="dropText"></ng-template> </div> </label> <button *ngIf="!drop" type="button" [cdsButton]="buttonType" (click)="fileInput.click()" [attr.for]="fileUploaderId" [size]="size" [disabled]="disabled"> {{buttonText}} </button> <input #fileInput type="file" class="cds--file-input" [accept]="accept" [id]="fileUploaderId" [multiple]="multiple" tabindex="-1" (change)="onFilesAdded()" [disabled]="disabled"/> <div class="cds--file-container"> <ng-container *ngFor="let fileItem of files"> <cds-file [fileItem]="fileItem" [nameTpl]="fileNameTpl" [actionsTpl]="fileActionsTpl" [size]="fileItemSize" (remove)="removeFile(fileItem)"> </cds-file> </ng-container> </div> </div></ng-container><ng-template #skeletonTemplate> <div class="cds--skeleton__text" style="width: 100px"></div> <div class="cds--skeleton__text" style="width: 225px"></div> <button cdsButton skeleton="true"></button></ng-template> </div>'
2330
2402
  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': 'ComboButtonComponent', 'selector': 'cds-combo-button'},{'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-menu, cds-context-menu, ibm-context-menu'},{'name': 'ContextMenuDividerComponent', 'selector': 'cds-menu-divider, cds-context-menu-divider, ibm-context-menu-divider'},{'name': 'ContextMenuGroupComponent', 'selector': 'cds-menu-group, cds-context-menu-group, ibm-context-menu-group'},{'name': 'ContextMenuItemComponent', 'selector': 'cds-menu-item, 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': 'MenuButtonComponent', 'selector': 'cds-menu-button'},{'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': 'TagOperationalComponent', 'selector': 'cds-tag-operational, ibm-tag-operational'},{'name': 'TagSelectableComponent', 'selector': 'cds-tag-selectable, ibm-tag-selectable'},{'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'}];
2331
2403
  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': 'ClickableTileIconDirective', 'selector': '[cdsClickableTileIcon], [ibmClickableTileIcon]'},{'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': 'LinkIconDirective', 'selector': '[ibmLinkIcon], [cdsLinkIcon]'},{'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': 'RouterLinkExtendedDirective', 'selector': '[routerLink]'},{'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': 'TagIconDirective', 'selector': '[cdsTagIcon], [ibmTagIcon]'},{'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]'}];
2332
2404
  var ACTUAL_COMPONENT = {'name': 'FileUploader'};