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
@@ -69,12 +69,6 @@
69
69
 
70
70
 
71
71
 
72
- <p class="comment">
73
- <h3>Implements</h3>
74
- </p>
75
- <p class="comment">
76
- <code>OnInit</code>
77
- </p>
78
72
 
79
73
 
80
74
  <section data-compodoc="block-metadata">
@@ -114,20 +108,6 @@
114
108
  </td>
115
109
  </tr>
116
110
 
117
- <tr>
118
- <td class="col-md-4">
119
- <h6><b>Methods</b></h6>
120
- </td>
121
- </tr>
122
- <tr>
123
- <td class="col-md-4">
124
- <ul class="index-list">
125
- <li>
126
- <a href="#ngOnInit" >ngOnInit</a>
127
- </li>
128
- </ul>
129
- </td>
130
- </tr>
131
111
 
132
112
  <tr>
133
113
  <td class="col-md-4">
@@ -208,7 +188,7 @@
208
188
  </tr>
209
189
  <tr>
210
190
  <td class="col-md-4">
211
- <div class="io-line">Defined in <a href="" data-line="45" class="link-to-prism">src/layout/stack.directive.ts:45</a></div>
191
+ <div class="io-line">Defined in <a href="" data-line="47" class="link-to-prism">src/layout/stack.directive.ts:47</a></div>
212
192
  </td>
213
193
  </tr>
214
194
 
@@ -270,7 +250,7 @@
270
250
  </tr>
271
251
  <tr>
272
252
  <td class="col-md-4">
273
- <i>Type : </i> <code>&quot;vertical&quot; | &quot;horizontal&quot;</code>
253
+ <i>Type : </i> <code>&quot;vertical&quot; | &quot;horizontal&quot; | string</code>
274
254
 
275
255
  </td>
276
256
  </tr>
@@ -281,12 +261,14 @@
281
261
  </tr>
282
262
  <tr>
283
263
  <td class="col-md-2" colspan="2">
284
- <div class="io-line">Defined in <a href="" data-line="32" class="link-to-prism">src/layout/stack.directive.ts:32</a></div>
264
+ <div class="io-line">Defined in <a href="" data-line="34" class="link-to-prism">src/layout/stack.directive.ts:34</a></div>
285
265
  </td>
286
266
  </tr>
287
267
  <tr>
288
268
  <td class="col-md-4">
289
- <div class="io-description"><p>Orientation of the items in the stack, defaults to <code>vertical</code></p>
269
+ <div class="io-description"><p>Orientation of the items in the stack, defaults to <code>vertical</code>
270
+ Empty string is equivalent to &quot;vertical&quot;</p>
271
+ <p>Empty string has been added as an option for Angular 16+ to resolve type errors</p>
290
272
  </div>
291
273
  </td>
292
274
  </tr>
@@ -308,7 +290,7 @@
308
290
  </tr>
309
291
  <tr>
310
292
  <td class="col-md-2" colspan="2">
311
- <div class="io-line">Defined in <a href="" data-line="37" class="link-to-prism">src/layout/stack.directive.ts:37</a></div>
293
+ <div class="io-line">Defined in <a href="" data-line="39" class="link-to-prism">src/layout/stack.directive.ts:39</a></div>
312
294
  </td>
313
295
  </tr>
314
296
  <tr>
@@ -335,7 +317,7 @@
335
317
  </tr>
336
318
  <tr>
337
319
  <td class="col-md-2" colspan="2">
338
- <div class="io-line">Defined in <a href="" data-line="25" class="link-to-prism">src/layout/stack.directive.ts:25</a></div>
320
+ <div class="io-line">Defined in <a href="" data-line="24" class="link-to-prism">src/layout/stack.directive.ts:24</a></div>
339
321
  </td>
340
322
  </tr>
341
323
  </tbody>
@@ -362,7 +344,7 @@
362
344
  </tr>
363
345
  <tr>
364
346
  <td class="col-md-4">
365
- <div class="io-line">Defined in <a href="" data-line="14" class="link-to-prism">src/layout/stack.directive.ts:14</a></div>
347
+ <div class="io-line">Defined in <a href="" data-line="13" class="link-to-prism">src/layout/stack.directive.ts:13</a></div>
366
348
  </td>
367
349
  </tr>
368
350
 
@@ -388,7 +370,7 @@
388
370
  </tr>
389
371
  <tr>
390
372
  <td class="col-md-4">
391
- <div class="io-line">Defined in <a href="" data-line="18" class="link-to-prism">src/layout/stack.directive.ts:18</a></div>
373
+ <div class="io-line">Defined in <a href="" data-line="17" class="link-to-prism">src/layout/stack.directive.ts:17</a></div>
392
374
  </td>
393
375
  </tr>
394
376
 
@@ -398,52 +380,7 @@
398
380
  </section>
399
381
 
400
382
 
401
- <section data-compodoc="block-methods">
402
-
403
- <h3 id="methods">
404
- Methods
405
- </h3>
406
- <table class="table table-sm table-bordered">
407
- <tbody>
408
- <tr>
409
- <td class="col-md-4">
410
- <a name="ngOnInit"></a>
411
- <span class="name">
412
- <span ><b>ngOnInit</b></span>
413
- <a href="#ngOnInit"><span class="icon ion-ios-link"></span></a>
414
- </span>
415
- </td>
416
- </tr>
417
- <tr>
418
- <td class="col-md-4">
419
- <code>ngOnInit()</code>
420
- </td>
421
- </tr>
422
-
423
-
424
- <tr>
425
- <td class="col-md-4">
426
- <div class="io-line">Defined in <a href="" data-line="53"
427
- class="link-to-prism">src/layout/stack.directive.ts:53</a></div>
428
- </td>
429
- </tr>
430
-
431
-
432
- <tr>
433
- <td class="col-md-4">
434
- <div class="io-description"><p>We need to make sure cdsStack is not an empty string since
435
- input name matches selector name.</p>
436
- </div>
437
-
438
- <div class="io-description">
439
- <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
440
383
 
441
- </div>
442
- </td>
443
- </tr>
444
- </tbody>
445
- </table>
446
- </section>
447
384
  <section data-compodoc="block-properties">
448
385
 
449
386
  <h3 id="inputs">
@@ -463,7 +400,7 @@ input name matches selector name.</p>
463
400
  </tr>
464
401
  <tr>
465
402
  <td class="col-md-4">
466
- <div class="io-line">Defined in <a href="" data-line="45" class="link-to-prism">src/layout/stack.directive.ts:45</a></div>
403
+ <div class="io-line">Defined in <a href="" data-line="47" class="link-to-prism">src/layout/stack.directive.ts:47</a></div>
467
404
  </td>
468
405
  </tr>
469
406
 
@@ -492,7 +429,7 @@ input name matches selector name.</p>
492
429
  </tr>
493
430
  <tr>
494
431
  <td class="col-md-4">
495
- <div class="io-line">Defined in <a href="" data-line="14" class="link-to-prism">src/layout/stack.directive.ts:14</a></div>
432
+ <div class="io-line">Defined in <a href="" data-line="13" class="link-to-prism">src/layout/stack.directive.ts:13</a></div>
496
433
  </td>
497
434
  </tr>
498
435
 
@@ -514,7 +451,7 @@ input name matches selector name.</p>
514
451
  </tr>
515
452
  <tr>
516
453
  <td class="col-md-4">
517
- <div class="io-line">Defined in <a href="" data-line="18" class="link-to-prism">src/layout/stack.directive.ts:18</a></div>
454
+ <div class="io-line">Defined in <a href="" data-line="17" class="link-to-prism">src/layout/stack.directive.ts:17</a></div>
518
455
  </td>
519
456
  </tr>
520
457
 
@@ -537,7 +474,7 @@ input name matches selector name.</p>
537
474
  </tr>
538
475
  <tr>
539
476
  <td class="col-md-4">
540
- <div class="io-line">Defined in <a href="" data-line="25" class="link-to-prism">src/layout/stack.directive.ts:25</a></div>
477
+ <div class="io-line">Defined in <a href="" data-line="24" class="link-to-prism">src/layout/stack.directive.ts:24</a></div>
541
478
  </td>
542
479
  </tr>
543
480
  <tr>
@@ -596,7 +533,7 @@ input name matches selector name.</p>
596
533
  </tr>
597
534
  <tr>
598
535
  <td class="col-md-4">
599
- <div class="io-line">Defined in <a href="" data-line="37" class="link-to-prism">src/layout/stack.directive.ts:37</a></div>
536
+ <div class="io-line">Defined in <a href="" data-line="39" class="link-to-prism">src/layout/stack.directive.ts:39</a></div>
600
537
  </td>
601
538
  </tr>
602
539
  <tr>
@@ -651,20 +588,19 @@ input name matches selector name.</p>
651
588
  ElementRef,
652
589
  HostBinding,
653
590
  Input,
654
- OnInit,
655
591
  Renderer2
656
592
  } from &quot;@angular/core&quot;;
657
593
 
658
594
  @Directive({
659
595
  selector: &quot;[cdsStack], [ibmStack]&quot;
660
596
  })
661
- export class StackDirective implements OnInit {
597
+ export class StackDirective {
662
598
  @HostBinding(&quot;class.cds--stack-horizontal&quot;) get isHorizontal() {
663
599
  return this.cdsStack &#x3D;&#x3D;&#x3D; &quot;horizontal&quot;;
664
600
  }
665
601
 
666
602
  @HostBinding(&quot;class.cds--stack-vertical&quot;) get isVertical() {
667
- return this.cdsStack &#x3D;&#x3D;&#x3D; &quot;vertical&quot;;
603
+ return this.cdsStack &#x3D;&#x3D;&#x3D; &quot;vertical&quot; || !this.cdsStack;
668
604
  }
669
605
 
670
606
  /**
@@ -676,8 +612,11 @@ export class StackDirective implements OnInit {
676
612
 
677
613
  /**
678
614
  * Orientation of the items in the stack, defaults to &#x60;vertical&#x60;
615
+ * Empty string is equivalent to &quot;vertical&quot;
616
+ *
617
+ * Empty string has been added as an option for Angular 16+ to resolve type errors
679
618
  */
680
- @Input() cdsStack: &quot;vertical&quot; | &quot;horizontal&quot; &#x3D; &quot;vertical&quot;;
619
+ @Input() cdsStack: &quot;vertical&quot; | &quot;horizontal&quot; | &quot;&quot; &#x3D; &quot;vertical&quot;;
681
620
 
682
621
  /**
683
622
  * Gap in the layout, provide a custom value (string) or a step from the spacing scale (number)
@@ -692,17 +631,7 @@ export class StackDirective implements OnInit {
692
631
  // Used to track previous value of gap so we can dynamically remove class
693
632
  private _gap;
694
633
 
695
- constructor(private render: Renderer2, private hostElement: ElementRef) { }
696
-
697
- /**
698
- * We need to make sure cdsStack is not an empty string since
699
- * input name matches selector name.
700
- */
701
- ngOnInit(): void {
702
- if (!this.cdsStack) {
703
- this.cdsStack &#x3D; &quot;vertical&quot;;
704
- }
705
- }
634
+ constructor(private render: Renderer2, private hostElement: ElementRef) {}
706
635
  }
707
636
  </code></pre>
708
637
  </div>
@@ -81,7 +81,6 @@
81
81
  <h3>Implements</h3>
82
82
  </p>
83
83
  <p class="comment">
84
- <code>OnInit</code>
85
84
  <code>AfterContentChecked</code>
86
85
  </p>
87
86
 
@@ -142,9 +141,6 @@
142
141
  <li>
143
142
  <a href="#ngAfterContentChecked" >ngAfterContentChecked</a>
144
143
  </li>
145
- <li>
146
- <a href="#ngOnInit" >ngOnInit</a>
147
- </li>
148
144
  </ul>
149
145
  </td>
150
146
  </tr>
@@ -239,7 +235,7 @@
239
235
  </tr>
240
236
  <tr>
241
237
  <td class="col-md-4">
242
- <i>Type : </i> <code>&quot;white&quot; | &quot;g10&quot; | &quot;g90&quot; | &quot;g100&quot;</code>
238
+ <i>Type : </i> <code><a href="../miscellaneous/typealiases.html#ThemeType" target="_self" >ThemeType | string</a></code>
243
239
 
244
240
  </td>
245
241
  </tr>
@@ -250,12 +246,14 @@
250
246
  </tr>
251
247
  <tr>
252
248
  <td class="col-md-2" colspan="2">
253
- <div class="io-line">Defined in <a href="" data-line="32" class="link-to-prism">src/theme/theme.directive.ts:32</a></div>
249
+ <div class="io-line">Defined in <a href="" data-line="35" class="link-to-prism">src/theme/theme.directive.ts:35</a></div>
254
250
  </td>
255
251
  </tr>
256
252
  <tr>
257
253
  <td class="col-md-4">
258
- <div class="io-description"><p>Sets the theme for the content</p>
254
+ <div class="io-description"><p>Sets the theme for the content
255
+ Accepts <code>ThemeType</code> or nothing (empty string which is equivalent to &quot;white&quot;)
256
+ Empty string has been added as an option for Angular 16+ to resolve type errors</p>
259
257
  </div>
260
258
  </td>
261
259
  </tr>
@@ -271,13 +269,13 @@
271
269
  </tr>
272
270
  <tr>
273
271
  <td class="col-md-4">
274
- <i>Type : </i> <code>&quot;white&quot; | &quot;g10&quot; | &quot;g90&quot; | &quot;g100&quot;</code>
272
+ <i>Type : </i> <code><a href="../miscellaneous/typealiases.html#ThemeType" target="_self" >ThemeType | string</a></code>
275
273
 
276
274
  </td>
277
275
  </tr>
278
276
  <tr>
279
277
  <td class="col-md-2" colspan="2">
280
- <div class="io-line">Defined in <a href="" data-line="25" class="link-to-prism">src/theme/theme.directive.ts:25</a></div>
278
+ <div class="io-line">Defined in <a href="" data-line="26" class="link-to-prism">src/theme/theme.directive.ts:26</a></div>
281
279
  </td>
282
280
  </tr>
283
281
  </tbody>
@@ -304,7 +302,7 @@
304
302
  </tr>
305
303
  <tr>
306
304
  <td class="col-md-4">
307
- <div class="io-line">Defined in <a href="" data-line="44" class="link-to-prism">src/theme/theme.directive.ts:44</a></div>
305
+ <div class="io-line">Defined in <a href="" data-line="47" class="link-to-prism">src/theme/theme.directive.ts:47</a></div>
308
306
  </td>
309
307
  </tr>
310
308
 
@@ -330,7 +328,7 @@
330
328
  </tr>
331
329
  <tr>
332
330
  <td class="col-md-4">
333
- <div class="io-line">Defined in <a href="" data-line="52" class="link-to-prism">src/theme/theme.directive.ts:52</a></div>
331
+ <div class="io-line">Defined in <a href="" data-line="55" class="link-to-prism">src/theme/theme.directive.ts:55</a></div>
334
332
  </td>
335
333
  </tr>
336
334
 
@@ -356,7 +354,7 @@
356
354
  </tr>
357
355
  <tr>
358
356
  <td class="col-md-4">
359
- <div class="io-line">Defined in <a href="" data-line="48" class="link-to-prism">src/theme/theme.directive.ts:48</a></div>
357
+ <div class="io-line">Defined in <a href="" data-line="51" class="link-to-prism">src/theme/theme.directive.ts:51</a></div>
360
358
  </td>
361
359
  </tr>
362
360
 
@@ -387,7 +385,7 @@
387
385
  </tr>
388
386
  <tr>
389
387
  <td class="col-md-4">
390
- <div class="io-line">Defined in <a href="" data-line="56" class="link-to-prism">src/theme/theme.directive.ts:56</a></div>
388
+ <div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/theme/theme.directive.ts:59</a></div>
391
389
  </td>
392
390
  </tr>
393
391
 
@@ -413,7 +411,7 @@
413
411
  </tr>
414
412
  <tr>
415
413
  <td class="col-md-4">
416
- <div class="io-line">Defined in <a href="" data-line="40" class="link-to-prism">src/theme/theme.directive.ts:40</a></div>
414
+ <div class="io-line">Defined in <a href="" data-line="43" class="link-to-prism">src/theme/theme.directive.ts:43</a></div>
417
415
  </td>
418
416
  </tr>
419
417
 
@@ -455,8 +453,8 @@ overwrite user added classes</p>
455
453
 
456
454
  <tr>
457
455
  <td class="col-md-4">
458
- <div class="io-line">Defined in <a href="" data-line="58"
459
- class="link-to-prism">src/theme/theme.directive.ts:58</a></div>
456
+ <div class="io-line">Defined in <a href="" data-line="61"
457
+ class="link-to-prism">src/theme/theme.directive.ts:61</a></div>
460
458
  </td>
461
459
  </tr>
462
460
 
@@ -464,46 +462,6 @@ overwrite user added classes</p>
464
462
  <tr>
465
463
  <td class="col-md-4">
466
464
 
467
- <div class="io-description">
468
- <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
469
-
470
- </div>
471
- </td>
472
- </tr>
473
- </tbody>
474
- </table>
475
- <table class="table table-sm table-bordered">
476
- <tbody>
477
- <tr>
478
- <td class="col-md-4">
479
- <a name="ngOnInit"></a>
480
- <span class="name">
481
- <span ><b>ngOnInit</b></span>
482
- <a href="#ngOnInit"><span class="icon ion-ios-link"></span></a>
483
- </span>
484
- </td>
485
- </tr>
486
- <tr>
487
- <td class="col-md-4">
488
- <code>ngOnInit()</code>
489
- </td>
490
- </tr>
491
-
492
-
493
- <tr>
494
- <td class="col-md-4">
495
- <div class="io-line">Defined in <a href="" data-line="74"
496
- class="link-to-prism">src/theme/theme.directive.ts:74</a></div>
497
- </td>
498
- </tr>
499
-
500
-
501
- <tr>
502
- <td class="col-md-4">
503
- <div class="io-description"><p>We need to make sure cdsTheme is not an empty string because
504
- input name matches selector name.</p>
505
- </div>
506
-
507
465
  <div class="io-description">
508
466
  <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
509
467
 
@@ -547,7 +505,7 @@ input name matches selector name.</p>
547
505
  </tr>
548
506
  <tr>
549
507
  <td class="col-md-4">
550
- <div class="io-line">Defined in <a href="" data-line="34" class="link-to-prism">src/theme/theme.directive.ts:34</a></div>
508
+ <div class="io-line">Defined in <a href="" data-line="37" class="link-to-prism">src/theme/theme.directive.ts:37</a></div>
551
509
  </td>
552
510
  </tr>
553
511
 
@@ -582,7 +540,7 @@ input name matches selector name.</p>
582
540
  </tr>
583
541
  <tr>
584
542
  <td class="col-md-4">
585
- <div class="io-line">Defined in <a href="" data-line="56" class="link-to-prism">src/theme/theme.directive.ts:56</a></div>
543
+ <div class="io-line">Defined in <a href="" data-line="59" class="link-to-prism">src/theme/theme.directive.ts:59</a></div>
586
544
  </td>
587
545
  </tr>
588
546
 
@@ -607,12 +565,12 @@ input name matches selector name.</p>
607
565
 
608
566
  <tr>
609
567
  <td class="col-md-4">
610
- <span class="accessor"><b>set</b><code>ibmTheme(type: "white" | "g10" | "g90" | "g100")</code></span>
568
+ <span class="accessor"><b>set</b><code>ibmTheme(type: <a href="../undefineds/ThemeType.html" target="_self">ThemeType | string</a>)</code></span>
611
569
  </td>
612
570
  </tr>
613
571
  <tr>
614
572
  <td class="col-md-4">
615
- <div class="io-line">Defined in <a href="" data-line="25" class="link-to-prism">src/theme/theme.directive.ts:25</a></div>
573
+ <div class="io-line">Defined in <a href="" data-line="26" class="link-to-prism">src/theme/theme.directive.ts:26</a></div>
616
574
  </td>
617
575
  </tr>
618
576
  <tr>
@@ -633,7 +591,7 @@ input name matches selector name.</p>
633
591
  <td>type</td>
634
592
 
635
593
  <td>
636
- <code>&quot;white&quot; | &quot;g10&quot; | &quot;g90&quot; | &quot;g100&quot;</code>
594
+ <code><a href="../miscellaneous/typealiases.html#ThemeType" target="_self" >ThemeType | string</a></code>
637
595
  </td>
638
596
 
639
597
  <td>
@@ -670,7 +628,7 @@ input name matches selector name.</p>
670
628
  </tr>
671
629
  <tr>
672
630
  <td class="col-md-4">
673
- <div class="io-line">Defined in <a href="" data-line="40" class="link-to-prism">src/theme/theme.directive.ts:40</a></div>
631
+ <div class="io-line">Defined in <a href="" data-line="43" class="link-to-prism">src/theme/theme.directive.ts:43</a></div>
674
632
  </td>
675
633
  </tr>
676
634
  <tr>
@@ -700,7 +658,7 @@ overwrite user added classes</p>
700
658
  </tr>
701
659
  <tr>
702
660
  <td class="col-md-4">
703
- <div class="io-line">Defined in <a href="" data-line="44" class="link-to-prism">src/theme/theme.directive.ts:44</a></div>
661
+ <div class="io-line">Defined in <a href="" data-line="47" class="link-to-prism">src/theme/theme.directive.ts:47</a></div>
704
662
  </td>
705
663
  </tr>
706
664
 
@@ -722,7 +680,7 @@ overwrite user added classes</p>
722
680
  </tr>
723
681
  <tr>
724
682
  <td class="col-md-4">
725
- <div class="io-line">Defined in <a href="" data-line="48" class="link-to-prism">src/theme/theme.directive.ts:48</a></div>
683
+ <div class="io-line">Defined in <a href="" data-line="51" class="link-to-prism">src/theme/theme.directive.ts:51</a></div>
726
684
  </td>
727
685
  </tr>
728
686
 
@@ -744,7 +702,7 @@ overwrite user added classes</p>
744
702
  </tr>
745
703
  <tr>
746
704
  <td class="col-md-4">
747
- <div class="io-line">Defined in <a href="" data-line="52" class="link-to-prism">src/theme/theme.directive.ts:52</a></div>
705
+ <div class="io-line">Defined in <a href="" data-line="55" class="link-to-prism">src/theme/theme.directive.ts:55</a></div>
748
706
  </td>
749
707
  </tr>
750
708
 
@@ -762,11 +720,12 @@ overwrite user added classes</p>
762
720
  Directive,
763
721
  HostBinding,
764
722
  Input,
765
- OnInit,
766
723
  QueryList
767
724
  } from &quot;@angular/core&quot;;
768
725
  import { LayerDirective } from &quot;carbon-components-angular/layer&quot;;
769
726
 
727
+ export type ThemeType &#x3D; &quot;white&quot; | &quot;g10&quot; | &quot;g90&quot; | &quot;g100&quot;;
728
+
770
729
  /**
771
730
  * Applies theme styles to the div container it is applied to.
772
731
  *
@@ -776,18 +735,20 @@ import { LayerDirective } from &quot;carbon-components-angular/layer&quot;;
776
735
  selector: &quot;[cdsTheme], [ibmTheme]&quot;,
777
736
  exportAs: &quot;theme&quot;
778
737
  })
779
- export class ThemeDirective implements OnInit, AfterContentChecked {
738
+ export class ThemeDirective implements AfterContentChecked {
780
739
  /**
781
740
  * @deprecated as of v5 - Use &#x60;cdsTheme&#x60; input property instead
782
741
  */
783
- @Input() set ibmTheme(type: &quot;white&quot; | &quot;g10&quot; | &quot;g90&quot; | &quot;g100&quot;) {
742
+ @Input() set ibmTheme(type: ThemeType | &quot;&quot;) {
784
743
  this.cdsTheme &#x3D; type;
785
744
  }
786
745
 
787
746
  /**
788
747
  * Sets the theme for the content
748
+ * Accepts &#x60;ThemeType&#x60; or nothing (empty string which is equivalent to &quot;white&quot;)
749
+ * Empty string has been added as an option for Angular 16+ to resolve type errors
789
750
  */
790
- @Input() cdsTheme: &quot;white&quot; | &quot;g10&quot; | &quot;g90&quot; | &quot;g100&quot; &#x3D; &quot;white&quot;;
751
+ @Input() cdsTheme: ThemeType | &quot;&quot; &#x3D; &quot;white&quot;;
791
752
 
792
753
  @ContentChildren(LayerDirective, { descendants: false }) layerChildren: QueryList&lt;LayerDirective&gt;;
793
754
 
@@ -796,7 +757,7 @@ export class ThemeDirective implements OnInit, AfterContentChecked {
796
757
  * overwrite user added classes
797
758
  */
798
759
  @HostBinding(&quot;class.cds--white&quot;) get whiteThemeClass() {
799
- return this.cdsTheme &#x3D;&#x3D;&#x3D; &quot;white&quot;;
760
+ return this.cdsTheme &#x3D;&#x3D;&#x3D; &quot;white&quot; || !this.cdsTheme;
800
761
  }
801
762
 
802
763
  @HostBinding(&quot;class.cds--g10&quot;) get g10ThemeClass() {
@@ -824,16 +785,6 @@ export class ThemeDirective implements OnInit, AfterContentChecked {
824
785
  }
825
786
  });
826
787
  }
827
-
828
- /**
829
- * We need to make sure cdsTheme is not an empty string because
830
- * input name matches selector name.
831
- */
832
- ngOnInit(): void {
833
- if (!this.cdsTheme) {
834
- this.cdsTheme &#x3D; &quot;white&quot;;
835
- }
836
- }
837
788
  }
838
789
  </code></pre>
839
790
  </div>