carbon-components-angular 5.10.5 → 5.11.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 (73) hide show
  1. package/button/button.directive.d.ts +5 -9
  2. package/docs/documentation/coverage.html +10 -10
  3. package/docs/documentation/dependencies.html +3 -3
  4. package/docs/documentation/directives/Button.html +44 -116
  5. package/docs/documentation/directives/StackDirective.html +22 -93
  6. package/docs/documentation/directives/ThemeDirective.html +31 -80
  7. package/docs/documentation/js/search/search_index.js +2 -2
  8. package/docs/documentation/miscellaneous/typealiases.html +21 -0
  9. package/docs/documentation/modules/CodeSnippetModule/dependencies.svg +4 -4
  10. package/docs/documentation/modules/CodeSnippetModule.html +4 -4
  11. package/docs/documentation/modules/DatePickerInputModule/dependencies.svg +42 -38
  12. package/docs/documentation/modules/DatePickerInputModule.html +42 -38
  13. package/docs/documentation/modules/FileUploaderModule/dependencies.svg +4 -4
  14. package/docs/documentation/modules/FileUploaderModule.html +4 -4
  15. package/docs/documentation/modules/NumberModule/dependencies.svg +4 -4
  16. package/docs/documentation/modules/NumberModule.html +4 -4
  17. package/docs/documentation/modules/PanelModule/dependencies.svg +36 -36
  18. package/docs/documentation/modules/PanelModule.html +36 -36
  19. package/docs/documentation/modules/RadioModule/dependencies.svg +49 -49
  20. package/docs/documentation/modules/RadioModule.html +49 -49
  21. package/docs/documentation/modules/SelectModule/dependencies.svg +43 -43
  22. package/docs/documentation/modules/SelectModule.html +43 -43
  23. package/docs/documentation/modules/SliderModule/dependencies.svg +4 -4
  24. package/docs/documentation/modules/SliderModule.html +4 -4
  25. package/docs/documentation/modules/TableModule/dependencies.svg +216 -216
  26. package/docs/documentation/modules/TableModule.html +216 -216
  27. package/docs/documentation/modules/TabsModule/dependencies.svg +4 -4
  28. package/docs/documentation/modules/TabsModule.html +4 -4
  29. package/docs/documentation/modules/TagModule/dependencies.svg +28 -28
  30. package/docs/documentation/modules/TagModule.html +28 -28
  31. package/docs/documentation/modules/TilesModule/dependencies.svg +4 -4
  32. package/docs/documentation/modules/TilesModule.html +4 -4
  33. package/docs/documentation/modules/TimePickerModule/dependencies.svg +26 -26
  34. package/docs/documentation/modules/TimePickerModule.html +26 -26
  35. package/docs/documentation/modules/TimePickerSelectModule/dependencies.svg +49 -45
  36. package/docs/documentation/modules/TimePickerSelectModule.html +49 -45
  37. package/docs/documentation/modules/ToggleModule/dependencies.svg +45 -41
  38. package/docs/documentation/modules/ToggleModule.html +45 -41
  39. package/docs/documentation/modules/ToggletipModule/dependencies.svg +39 -39
  40. package/docs/documentation/modules/ToggletipModule.html +39 -39
  41. package/docs/documentation/modules/TooltipModule/dependencies.svg +28 -28
  42. package/docs/documentation/modules/TooltipModule.html +28 -28
  43. package/docs/documentation.json +111 -94
  44. package/docs/storybook/4578.d79a1b3e.iframe.bundle.js +1 -0
  45. package/docs/storybook/iframe.html +2 -2
  46. package/docs/storybook/layout-stack-stories.95acac06.iframe.bundle.js +1 -0
  47. package/docs/storybook/main.3edf90e2.iframe.bundle.js +1 -0
  48. package/docs/storybook/project.json +1 -1
  49. package/docs/storybook/{runtime~main.a7cebcd5.iframe.bundle.js → runtime~main.6c3bf6d5.iframe.bundle.js} +1 -1
  50. package/docs/storybook/theme-theme-stories.839db355.iframe.bundle.js +1 -0
  51. package/docs/storybook/{ui-shell-ui-shell-stories.a62b6ed8.iframe.bundle.js → ui-shell-ui-shell-stories.704e84bd.iframe.bundle.js} +1 -1
  52. package/esm2020/button/button.directive.mjs +5 -12
  53. package/esm2020/layout/stack.directive.mjs +5 -11
  54. package/esm2020/theme/theme.directive.mjs +4 -11
  55. package/fesm2015/carbon-components-angular-button.mjs +4 -11
  56. package/fesm2015/carbon-components-angular-button.mjs.map +1 -1
  57. package/fesm2015/carbon-components-angular-layout.mjs +4 -10
  58. package/fesm2015/carbon-components-angular-layout.mjs.map +1 -1
  59. package/fesm2015/carbon-components-angular-theme.mjs +3 -10
  60. package/fesm2015/carbon-components-angular-theme.mjs.map +1 -1
  61. package/fesm2020/carbon-components-angular-button.mjs +4 -11
  62. package/fesm2020/carbon-components-angular-button.mjs.map +1 -1
  63. package/fesm2020/carbon-components-angular-layout.mjs +4 -10
  64. package/fesm2020/carbon-components-angular-layout.mjs.map +1 -1
  65. package/fesm2020/carbon-components-angular-theme.mjs +3 -10
  66. package/fesm2020/carbon-components-angular-theme.mjs.map +1 -1
  67. package/layout/stack.directive.d.ts +6 -8
  68. package/package.json +1 -1
  69. package/theme/theme.directive.d.ts +7 -9
  70. package/docs/storybook/4578.e4cc4f76.iframe.bundle.js +0 -1
  71. package/docs/storybook/layout-stack-stories.0a86a824.iframe.bundle.js +0 -1
  72. package/docs/storybook/main.a1f99d92.iframe.bundle.js +0 -1
  73. package/docs/storybook/theme-theme-stories.f7a4082c.iframe.bundle.js +0 -1
@@ -18,7 +18,6 @@
18
18
  */
19
19
 
20
20
 
21
- import { OnInit } from "@angular/core";
22
21
  import { ButtonSize, ButtonType } from "./button.types";
23
22
  import * as i0 from "@angular/core";
24
23
  /**
@@ -35,15 +34,17 @@ import * as i0 from "@angular/core";
35
34
  *
36
35
  * See the [vanilla carbon docs](http://www.carbondesignsystem.com/components/button/code) for more detail.
37
36
  */
38
- export declare class Button implements OnInit {
37
+ export declare class Button {
39
38
  /**
40
39
  * @deprecated as of v5 - Use `cdsButton` input property instead
41
40
  */
42
41
  set ibmButton(type: ButtonType);
43
42
  /**
44
- * sets the button type
43
+ * Sets the button type
44
+ * Accepts `ButtonType` or nothing (empty string which is equivalent to "primary")
45
+ * Empty string has been added as an option for Angular 16+ to resolve type errors
45
46
  */
46
- cdsButton: ButtonType;
47
+ cdsButton: ButtonType | "";
47
48
  /**
48
49
  * Specify the size of the button
49
50
  */
@@ -75,11 +76,6 @@ export declare class Button implements OnInit {
75
76
  get largeSize(): boolean;
76
77
  get extraLargeSize(): boolean;
77
78
  get twoExtraLargeSize(): boolean;
78
- /**
79
- * We need to make sure cdsButton is not an empty string since
80
- * input name matches selector name.
81
- */
82
- ngOnInit(): void;
83
79
  static ɵfac: i0.ɵɵFactoryDeclaration<Button, never>;
84
80
  static ɵdir: i0.ɵɵDirectiveDeclaration<Button, "[cdsButton], [ibmButton]", never, { "ibmButton": "ibmButton"; "cdsButton": "cdsButton"; "size": "size"; "skeleton": "skeleton"; "iconOnly": "iconOnly"; "isExpressive": "isExpressive"; }, {}, never, never, false>;
85
81
  }
@@ -170,9 +170,9 @@
170
170
  </td>
171
171
  <td>directive</td>
172
172
  <td>Button</td>
173
- <td align="right" data-sort="31">
174
- <span class="coverage-percent">31 %</span>
175
- <span class="coverage-count">(7/22)</span>
173
+ <td align="right" data-sort="28">
174
+ <span class="coverage-percent">28 %</span>
175
+ <span class="coverage-count">(6/21)</span>
176
176
  </td>
177
177
  </tr>
178
178
  <tr class="good">
@@ -1231,16 +1231,16 @@
1231
1231
  <span class="coverage-count">(0/1)</span>
1232
1232
  </td>
1233
1233
  </tr>
1234
- <tr class="medium">
1234
+ <tr class="low">
1235
1235
  <td>
1236
1236
  <!-- miscellaneous -->
1237
1237
  <a href="./directives/StackDirective.html">src/layout/stack.directive.ts</a>
1238
1238
  </td>
1239
1239
  <td>directive</td>
1240
1240
  <td>StackDirective</td>
1241
- <td align="right" data-sort="33">
1242
- <span class="coverage-percent">33 %</span>
1243
- <span class="coverage-count">(3/9)</span>
1241
+ <td align="right" data-sort="25">
1242
+ <span class="coverage-percent">25 %</span>
1243
+ <span class="coverage-count">(2/8)</span>
1244
1244
  </td>
1245
1245
  </tr>
1246
1246
  <tr class="good">
@@ -2594,9 +2594,9 @@
2594
2594
  </td>
2595
2595
  <td>directive</td>
2596
2596
  <td>ThemeDirective</td>
2597
- <td align="right" data-sort="33">
2598
- <span class="coverage-percent">33 %</span>
2599
- <span class="coverage-count">(4/12)</span>
2597
+ <td align="right" data-sort="27">
2598
+ <span class="coverage-percent">27 %</span>
2599
+ <span class="coverage-count">(3/11)</span>
2600
2600
  </td>
2601
2601
  </tr>
2602
2602
  <tr class="good">
@@ -70,11 +70,11 @@
70
70
  </ol>
71
71
  <ul class="dependencies-list">
72
72
  <li>
73
- <b>@angular/common</b> : ^14.0.0 || ^15.0.0</li>
73
+ <b>@angular/common</b> : ^14.0.0 || ^15.0.0 || ^16.0.0</li>
74
74
  <li>
75
- <b>@angular/core</b> : ^14.0.0 || ^15.0.0</li>
75
+ <b>@angular/core</b> : ^14.0.0 || ^15.0.0 || ^16.0.0</li>
76
76
  <li>
77
- <b>@angular/forms</b> : ^14.0.0 || ^15.0.0</li>
77
+ <b>@angular/forms</b> : ^14.0.0 || ^15.0.0 || ^16.0.0</li>
78
78
  <li>
79
79
  <b>@carbon/styles</b> : ^1.5.0</li>
80
80
  <li>
@@ -80,12 +80,6 @@
80
80
  </p>
81
81
 
82
82
 
83
- <p class="comment">
84
- <h3>Implements</h3>
85
- </p>
86
- <p class="comment">
87
- <code>OnInit</code>
88
- </p>
89
83
 
90
84
 
91
85
  <section data-compodoc="block-metadata">
@@ -125,20 +119,6 @@
125
119
  </td>
126
120
  </tr>
127
121
 
128
- <tr>
129
- <td class="col-md-4">
130
- <h6><b>Methods</b></h6>
131
- </td>
132
- </tr>
133
- <tr>
134
- <td class="col-md-4">
135
- <ul class="index-list">
136
- <li>
137
- <a href="#ngOnInit" >ngOnInit</a>
138
- </li>
139
- </ul>
140
- </td>
141
- </tr>
142
122
 
143
123
  <tr>
144
124
  <td class="col-md-4">
@@ -290,7 +270,7 @@
290
270
  </tr>
291
271
  <tr>
292
272
  <td class="col-md-4">
293
- <i>Type : </i> <code><a href="../miscellaneous/typealiases.html#ButtonType" target="_self" >ButtonType</a></code>
273
+ <i>Type : </i> <code><a href="../directives/Button.html" target="_self" >ButtonType | string</a></code>
294
274
 
295
275
  </td>
296
276
  </tr>
@@ -301,12 +281,14 @@
301
281
  </tr>
302
282
  <tr>
303
283
  <td class="col-md-2" colspan="2">
304
- <div class="io-line">Defined in <a href="" data-line="36" class="link-to-prism">src/button/button.directive.ts:36</a></div>
284
+ <div class="io-line">Defined in <a href="" data-line="37" class="link-to-prism">src/button/button.directive.ts:37</a></div>
305
285
  </td>
306
286
  </tr>
307
287
  <tr>
308
288
  <td class="col-md-4">
309
- <div class="io-description"><p>sets the button type</p>
289
+ <div class="io-description"><p>Sets the button type
290
+ Accepts <code>ButtonType</code> or nothing (empty string which is equivalent to &quot;primary&quot;)
291
+ Empty string has been added as an option for Angular 16+ to resolve type errors</p>
310
292
  </div>
311
293
  </td>
312
294
  </tr>
@@ -328,7 +310,7 @@
328
310
  </tr>
329
311
  <tr>
330
312
  <td class="col-md-2" colspan="2">
331
- <div class="io-line">Defined in <a href="" data-line="30" class="link-to-prism">src/button/button.directive.ts:30</a></div>
313
+ <div class="io-line">Defined in <a href="" data-line="29" class="link-to-prism">src/button/button.directive.ts:29</a></div>
332
314
  </td>
333
315
  </tr>
334
316
  </tbody>
@@ -354,7 +336,7 @@
354
336
  </tr>
355
337
  <tr>
356
338
  <td class="col-md-2" colspan="2">
357
- <div class="io-line">Defined in <a href="" data-line="50" class="link-to-prism">src/button/button.directive.ts:50</a></div>
339
+ <div class="io-line">Defined in <a href="" data-line="51" class="link-to-prism">src/button/button.directive.ts:51</a></div>
358
340
  </td>
359
341
  </tr>
360
342
  <tr>
@@ -388,7 +370,7 @@ This should only be used for creating custom icon buttons, otherwise use
388
370
  </tr>
389
371
  <tr>
390
372
  <td class="col-md-2" colspan="2">
391
- <div class="io-line">Defined in <a href="" data-line="55" class="link-to-prism">src/button/button.directive.ts:55</a></div>
373
+ <div class="io-line">Defined in <a href="" data-line="56" class="link-to-prism">src/button/button.directive.ts:56</a></div>
392
374
  </td>
393
375
  </tr>
394
376
  <tr>
@@ -415,7 +397,7 @@ This should only be used for creating custom icon buttons, otherwise use
415
397
  </tr>
416
398
  <tr>
417
399
  <td class="col-md-2" colspan="2">
418
- <div class="io-line">Defined in <a href="" data-line="40" class="link-to-prism">src/button/button.directive.ts:40</a></div>
400
+ <div class="io-line">Defined in <a href="" data-line="41" class="link-to-prism">src/button/button.directive.ts:41</a></div>
419
401
  </td>
420
402
  </tr>
421
403
  <tr>
@@ -447,7 +429,7 @@ This should only be used for creating custom icon buttons, otherwise use
447
429
  </tr>
448
430
  <tr>
449
431
  <td class="col-md-2" colspan="2">
450
- <div class="io-line">Defined in <a href="" data-line="44" class="link-to-prism">src/button/button.directive.ts:44</a></div>
432
+ <div class="io-line">Defined in <a href="" data-line="45" class="link-to-prism">src/button/button.directive.ts:45</a></div>
451
433
  </td>
452
434
  </tr>
453
435
  <tr>
@@ -485,7 +467,7 @@ This should only be used for creating custom icon buttons, otherwise use
485
467
  </tr>
486
468
  <tr>
487
469
  <td class="col-md-4">
488
- <div class="io-line">Defined in <a href="" data-line="58" class="link-to-prism">src/button/button.directive.ts:58</a></div>
470
+ <div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/button/button.directive.ts:59</a></div>
489
471
  </td>
490
472
  </tr>
491
473
 
@@ -511,7 +493,7 @@ This should only be used for creating custom icon buttons, otherwise use
511
493
  </tr>
512
494
  <tr>
513
495
  <td class="col-md-4">
514
- <div class="io-line">Defined in <a href="" data-line="92" class="link-to-prism">src/button/button.directive.ts:92</a></div>
496
+ <div class="io-line">Defined in <a href="" data-line="93" class="link-to-prism">src/button/button.directive.ts:93</a></div>
515
497
  </td>
516
498
  </tr>
517
499
 
@@ -537,7 +519,7 @@ This should only be used for creating custom icon buttons, otherwise use
537
519
  </tr>
538
520
  <tr>
539
521
  <td class="col-md-4">
540
- <div class="io-line">Defined in <a href="" data-line="71" class="link-to-prism">src/button/button.directive.ts:71</a></div>
522
+ <div class="io-line">Defined in <a href="" data-line="72" class="link-to-prism">src/button/button.directive.ts:72</a></div>
541
523
  </td>
542
524
  </tr>
543
525
 
@@ -563,7 +545,7 @@ This should only be used for creating custom icon buttons, otherwise use
563
545
  </tr>
564
546
  <tr>
565
547
  <td class="col-md-4">
566
- <div class="io-line">Defined in <a href="" data-line="77" class="link-to-prism">src/button/button.directive.ts:77</a></div>
548
+ <div class="io-line">Defined in <a href="" data-line="78" class="link-to-prism">src/button/button.directive.ts:78</a></div>
567
549
  </td>
568
550
  </tr>
569
551
 
@@ -589,7 +571,7 @@ This should only be used for creating custom icon buttons, otherwise use
589
571
  </tr>
590
572
  <tr>
591
573
  <td class="col-md-4">
592
- <div class="io-line">Defined in <a href="" data-line="74" class="link-to-prism">src/button/button.directive.ts:74</a></div>
574
+ <div class="io-line">Defined in <a href="" data-line="75" class="link-to-prism">src/button/button.directive.ts:75</a></div>
593
575
  </td>
594
576
  </tr>
595
577
 
@@ -615,7 +597,7 @@ This should only be used for creating custom icon buttons, otherwise use
615
597
  </tr>
616
598
  <tr>
617
599
  <td class="col-md-4">
618
- <div class="io-line">Defined in <a href="" data-line="68" class="link-to-prism">src/button/button.directive.ts:68</a></div>
600
+ <div class="io-line">Defined in <a href="" data-line="69" class="link-to-prism">src/button/button.directive.ts:69</a></div>
619
601
  </td>
620
602
  </tr>
621
603
 
@@ -641,7 +623,7 @@ This should only be used for creating custom icon buttons, otherwise use
641
623
  </tr>
642
624
  <tr>
643
625
  <td class="col-md-4">
644
- <div class="io-line">Defined in <a href="" data-line="86" class="link-to-prism">src/button/button.directive.ts:86</a></div>
626
+ <div class="io-line">Defined in <a href="" data-line="87" class="link-to-prism">src/button/button.directive.ts:87</a></div>
645
627
  </td>
646
628
  </tr>
647
629
 
@@ -667,7 +649,7 @@ This should only be used for creating custom icon buttons, otherwise use
667
649
  </tr>
668
650
  <tr>
669
651
  <td class="col-md-4">
670
- <div class="io-line">Defined in <a href="" data-line="83" class="link-to-prism">src/button/button.directive.ts:83</a></div>
652
+ <div class="io-line">Defined in <a href="" data-line="84" class="link-to-prism">src/button/button.directive.ts:84</a></div>
671
653
  </td>
672
654
  </tr>
673
655
 
@@ -693,7 +675,7 @@ This should only be used for creating custom icon buttons, otherwise use
693
675
  </tr>
694
676
  <tr>
695
677
  <td class="col-md-4">
696
- <div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/button/button.directive.ts:59</a></div>
678
+ <div class="io-line">Defined in <a href="" data-line="60" class="link-to-prism">src/button/button.directive.ts:60</a></div>
697
679
  </td>
698
680
  </tr>
699
681
 
@@ -719,7 +701,7 @@ This should only be used for creating custom icon buttons, otherwise use
719
701
  </tr>
720
702
  <tr>
721
703
  <td class="col-md-4">
722
- <div class="io-line">Defined in <a href="" data-line="62" class="link-to-prism">src/button/button.directive.ts:62</a></div>
704
+ <div class="io-line">Defined in <a href="" data-line="63" class="link-to-prism">src/button/button.directive.ts:63</a></div>
723
705
  </td>
724
706
  </tr>
725
707
 
@@ -745,7 +727,7 @@ This should only be used for creating custom icon buttons, otherwise use
745
727
  </tr>
746
728
  <tr>
747
729
  <td class="col-md-4">
748
- <div class="io-line">Defined in <a href="" data-line="80" class="link-to-prism">src/button/button.directive.ts:80</a></div>
730
+ <div class="io-line">Defined in <a href="" data-line="81" class="link-to-prism">src/button/button.directive.ts:81</a></div>
749
731
  </td>
750
732
  </tr>
751
733
 
@@ -771,7 +753,7 @@ This should only be used for creating custom icon buttons, otherwise use
771
753
  </tr>
772
754
  <tr>
773
755
  <td class="col-md-4">
774
- <div class="io-line">Defined in <a href="" data-line="65" class="link-to-prism">src/button/button.directive.ts:65</a></div>
756
+ <div class="io-line">Defined in <a href="" data-line="66" class="link-to-prism">src/button/button.directive.ts:66</a></div>
775
757
  </td>
776
758
  </tr>
777
759
 
@@ -797,7 +779,7 @@ This should only be used for creating custom icon buttons, otherwise use
797
779
  </tr>
798
780
  <tr>
799
781
  <td class="col-md-4">
800
- <div class="io-line">Defined in <a href="" data-line="89" class="link-to-prism">src/button/button.directive.ts:89</a></div>
782
+ <div class="io-line">Defined in <a href="" data-line="90" class="link-to-prism">src/button/button.directive.ts:90</a></div>
801
783
  </td>
802
784
  </tr>
803
785
 
@@ -807,52 +789,7 @@ This should only be used for creating custom icon buttons, otherwise use
807
789
  </section>
808
790
 
809
791
 
810
- <section data-compodoc="block-methods">
811
-
812
- <h3 id="methods">
813
- Methods
814
- </h3>
815
- <table class="table table-sm table-bordered">
816
- <tbody>
817
- <tr>
818
- <td class="col-md-4">
819
- <a name="ngOnInit"></a>
820
- <span class="name">
821
- <span ><b>ngOnInit</b></span>
822
- <a href="#ngOnInit"><span class="icon ion-ios-link"></span></a>
823
- </span>
824
- </td>
825
- </tr>
826
- <tr>
827
- <td class="col-md-4">
828
- <code>ngOnInit()</code>
829
- </td>
830
- </tr>
831
-
832
-
833
- <tr>
834
- <td class="col-md-4">
835
- <div class="io-line">Defined in <a href="" data-line="100"
836
- class="link-to-prism">src/button/button.directive.ts:100</a></div>
837
- </td>
838
- </tr>
839
792
 
840
-
841
- <tr>
842
- <td class="col-md-4">
843
- <div class="io-description"><p>We need to make sure cdsButton is not an empty string since
844
- input name matches selector name.</p>
845
- </div>
846
-
847
- <div class="io-description">
848
- <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
849
-
850
- </div>
851
- </td>
852
- </tr>
853
- </tbody>
854
- </table>
855
- </section>
856
793
  <section data-compodoc="block-properties">
857
794
 
858
795
  <h3 id="inputs">
@@ -886,7 +823,7 @@ input name matches selector name.</p>
886
823
  </tr>
887
824
  <tr>
888
825
  <td class="col-md-4">
889
- <div class="io-line">Defined in <a href="" data-line="58" class="link-to-prism">src/button/button.directive.ts:58</a></div>
826
+ <div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/button/button.directive.ts:59</a></div>
890
827
  </td>
891
828
  </tr>
892
829
 
@@ -916,7 +853,7 @@ input name matches selector name.</p>
916
853
  </tr>
917
854
  <tr>
918
855
  <td class="col-md-4">
919
- <div class="io-line">Defined in <a href="" data-line="30" class="link-to-prism">src/button/button.directive.ts:30</a></div>
856
+ <div class="io-line">Defined in <a href="" data-line="29" class="link-to-prism">src/button/button.directive.ts:29</a></div>
920
857
  </td>
921
858
  </tr>
922
859
  <tr>
@@ -974,7 +911,7 @@ input name matches selector name.</p>
974
911
  </tr>
975
912
  <tr>
976
913
  <td class="col-md-4">
977
- <div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/button/button.directive.ts:59</a></div>
914
+ <div class="io-line">Defined in <a href="" data-line="60" class="link-to-prism">src/button/button.directive.ts:60</a></div>
978
915
  </td>
979
916
  </tr>
980
917
 
@@ -996,7 +933,7 @@ input name matches selector name.</p>
996
933
  </tr>
997
934
  <tr>
998
935
  <td class="col-md-4">
999
- <div class="io-line">Defined in <a href="" data-line="62" class="link-to-prism">src/button/button.directive.ts:62</a></div>
936
+ <div class="io-line">Defined in <a href="" data-line="63" class="link-to-prism">src/button/button.directive.ts:63</a></div>
1000
937
  </td>
1001
938
  </tr>
1002
939
 
@@ -1018,7 +955,7 @@ input name matches selector name.</p>
1018
955
  </tr>
1019
956
  <tr>
1020
957
  <td class="col-md-4">
1021
- <div class="io-line">Defined in <a href="" data-line="65" class="link-to-prism">src/button/button.directive.ts:65</a></div>
958
+ <div class="io-line">Defined in <a href="" data-line="66" class="link-to-prism">src/button/button.directive.ts:66</a></div>
1022
959
  </td>
1023
960
  </tr>
1024
961
 
@@ -1040,7 +977,7 @@ input name matches selector name.</p>
1040
977
  </tr>
1041
978
  <tr>
1042
979
  <td class="col-md-4">
1043
- <div class="io-line">Defined in <a href="" data-line="68" class="link-to-prism">src/button/button.directive.ts:68</a></div>
980
+ <div class="io-line">Defined in <a href="" data-line="69" class="link-to-prism">src/button/button.directive.ts:69</a></div>
1044
981
  </td>
1045
982
  </tr>
1046
983
 
@@ -1062,7 +999,7 @@ input name matches selector name.</p>
1062
999
  </tr>
1063
1000
  <tr>
1064
1001
  <td class="col-md-4">
1065
- <div class="io-line">Defined in <a href="" data-line="71" class="link-to-prism">src/button/button.directive.ts:71</a></div>
1002
+ <div class="io-line">Defined in <a href="" data-line="72" class="link-to-prism">src/button/button.directive.ts:72</a></div>
1066
1003
  </td>
1067
1004
  </tr>
1068
1005
 
@@ -1084,7 +1021,7 @@ input name matches selector name.</p>
1084
1021
  </tr>
1085
1022
  <tr>
1086
1023
  <td class="col-md-4">
1087
- <div class="io-line">Defined in <a href="" data-line="74" class="link-to-prism">src/button/button.directive.ts:74</a></div>
1024
+ <div class="io-line">Defined in <a href="" data-line="75" class="link-to-prism">src/button/button.directive.ts:75</a></div>
1088
1025
  </td>
1089
1026
  </tr>
1090
1027
 
@@ -1106,7 +1043,7 @@ input name matches selector name.</p>
1106
1043
  </tr>
1107
1044
  <tr>
1108
1045
  <td class="col-md-4">
1109
- <div class="io-line">Defined in <a href="" data-line="77" class="link-to-prism">src/button/button.directive.ts:77</a></div>
1046
+ <div class="io-line">Defined in <a href="" data-line="78" class="link-to-prism">src/button/button.directive.ts:78</a></div>
1110
1047
  </td>
1111
1048
  </tr>
1112
1049
 
@@ -1128,7 +1065,7 @@ input name matches selector name.</p>
1128
1065
  </tr>
1129
1066
  <tr>
1130
1067
  <td class="col-md-4">
1131
- <div class="io-line">Defined in <a href="" data-line="80" class="link-to-prism">src/button/button.directive.ts:80</a></div>
1068
+ <div class="io-line">Defined in <a href="" data-line="81" class="link-to-prism">src/button/button.directive.ts:81</a></div>
1132
1069
  </td>
1133
1070
  </tr>
1134
1071
 
@@ -1150,7 +1087,7 @@ input name matches selector name.</p>
1150
1087
  </tr>
1151
1088
  <tr>
1152
1089
  <td class="col-md-4">
1153
- <div class="io-line">Defined in <a href="" data-line="83" class="link-to-prism">src/button/button.directive.ts:83</a></div>
1090
+ <div class="io-line">Defined in <a href="" data-line="84" class="link-to-prism">src/button/button.directive.ts:84</a></div>
1154
1091
  </td>
1155
1092
  </tr>
1156
1093
 
@@ -1172,7 +1109,7 @@ input name matches selector name.</p>
1172
1109
  </tr>
1173
1110
  <tr>
1174
1111
  <td class="col-md-4">
1175
- <div class="io-line">Defined in <a href="" data-line="86" class="link-to-prism">src/button/button.directive.ts:86</a></div>
1112
+ <div class="io-line">Defined in <a href="" data-line="87" class="link-to-prism">src/button/button.directive.ts:87</a></div>
1176
1113
  </td>
1177
1114
  </tr>
1178
1115
 
@@ -1194,7 +1131,7 @@ input name matches selector name.</p>
1194
1131
  </tr>
1195
1132
  <tr>
1196
1133
  <td class="col-md-4">
1197
- <div class="io-line">Defined in <a href="" data-line="89" class="link-to-prism">src/button/button.directive.ts:89</a></div>
1134
+ <div class="io-line">Defined in <a href="" data-line="90" class="link-to-prism">src/button/button.directive.ts:90</a></div>
1198
1135
  </td>
1199
1136
  </tr>
1200
1137
 
@@ -1216,7 +1153,7 @@ input name matches selector name.</p>
1216
1153
  </tr>
1217
1154
  <tr>
1218
1155
  <td class="col-md-4">
1219
- <div class="io-line">Defined in <a href="" data-line="92" class="link-to-prism">src/button/button.directive.ts:92</a></div>
1156
+ <div class="io-line">Defined in <a href="" data-line="93" class="link-to-prism">src/button/button.directive.ts:93</a></div>
1220
1157
  </td>
1221
1158
  </tr>
1222
1159
 
@@ -1231,8 +1168,7 @@ input name matches selector name.</p>
1231
1168
  <pre class="line-numbers compodoc-sourcecode"><code class="language-typescript">import {
1232
1169
  Directive,
1233
1170
  HostBinding,
1234
- Input,
1235
- OnInit
1171
+ Input
1236
1172
  } from &quot;@angular/core&quot;;
1237
1173
  import { ButtonSize, ButtonType } from &quot;./button.types&quot;;
1238
1174
 
@@ -1253,7 +1189,7 @@ import { ButtonSize, ButtonType } from &quot;./button.types&quot;;
1253
1189
  @Directive({
1254
1190
  selector: &quot;[cdsButton], [ibmButton]&quot;
1255
1191
  })
1256
- export class Button implements OnInit {
1192
+ export class Button {
1257
1193
  /**
1258
1194
  * @deprecated as of v5 - Use &#x60;cdsButton&#x60; input property instead
1259
1195
  */
@@ -1261,9 +1197,11 @@ export class Button implements OnInit {
1261
1197
  this.cdsButton &#x3D; type;
1262
1198
  }
1263
1199
  /**
1264
- * sets the button type
1200
+ * Sets the button type
1201
+ * Accepts &#x60;ButtonType&#x60; or nothing (empty string which is equivalent to &quot;primary&quot;)
1202
+ * Empty string has been added as an option for Angular 16+ to resolve type errors
1265
1203
  */
1266
- @Input() cdsButton: ButtonType &#x3D; &quot;primary&quot;;
1204
+ @Input() cdsButton: ButtonType | &quot;&quot; &#x3D; &quot;primary&quot;;
1267
1205
  /**
1268
1206
  * Specify the size of the button
1269
1207
  */
@@ -1287,7 +1225,7 @@ export class Button implements OnInit {
1287
1225
  // a whole lot of HostBindings ... this way we don&#x27;t have to touch the elementRef directly
1288
1226
  @HostBinding(&quot;class.cds--btn&quot;) baseClass &#x3D; true;
1289
1227
  @HostBinding(&quot;class.cds--btn--primary&quot;) get primaryButton() {
1290
- return this.cdsButton &#x3D;&#x3D;&#x3D; &quot;primary&quot;;
1228
+ return this.cdsButton &#x3D;&#x3D;&#x3D; &quot;primary&quot; || !this.cdsButton;
1291
1229
  }
1292
1230
  @HostBinding(&quot;class.cds--btn--secondary&quot;) get secondaryButton() {
1293
1231
  return this.cdsButton &#x3D;&#x3D;&#x3D; &quot;secondary&quot;;
@@ -1322,16 +1260,6 @@ export class Button implements OnInit {
1322
1260
  @HostBinding(&quot;class.cds--btn--2xl&quot;) get twoExtraLargeSize() {
1323
1261
  return this.size &#x3D;&#x3D;&#x3D; &quot;2xl&quot;;
1324
1262
  }
1325
-
1326
- /**
1327
- * We need to make sure cdsButton is not an empty string since
1328
- * input name matches selector name.
1329
- */
1330
- ngOnInit() {
1331
- if (!this.cdsButton) {
1332
- this.cdsButton &#x3D; &quot;primary&quot;;
1333
- }
1334
- }
1335
1263
  }
1336
1264
  </code></pre>
1337
1265
  </div>