@eui/ecl 18.0.0-next.73 → 18.0.0-next.75

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 (44) hide show
  1. package/docs/components/EclAccordionComponent.html +41 -141
  2. package/docs/components/EclAccordionItemComponent.html +39 -121
  3. package/docs/components/EclCarouselComponent.html +1 -1
  4. package/docs/components/EclCarouselItemComponent.html +69 -0
  5. package/docs/components/EclIconComponent.html +36 -121
  6. package/docs/components/EclMenuItemComponent.html +1 -13
  7. package/docs/components/EclMenuMegaItemComponent.html +1 -1
  8. package/docs/dependencies.html +1 -1
  9. package/docs/directives/ECLBaseDirective.html +4 -0
  10. package/docs/js/search/search_index.js +2 -2
  11. package/esm2022/lib/components/ecl-accordion/ecl-accordion-item.component.mjs +15 -10
  12. package/esm2022/lib/components/ecl-accordion/ecl-accordion.component.mjs +13 -9
  13. package/esm2022/lib/components/ecl-base.directive.mjs +3 -2
  14. package/esm2022/lib/components/ecl-button/ecl-button.component.mjs +2 -2
  15. package/esm2022/lib/components/ecl-carousel/ecl-carousel-item.component.mjs +6 -2
  16. package/esm2022/lib/components/ecl-carousel/ecl-carousel.component.mjs +6 -32
  17. package/esm2022/lib/components/ecl-date-picker/ecl-date-picker.directive.mjs +2 -2
  18. package/esm2022/lib/components/ecl-fact-figures/ecl-fact-figures-item.component.mjs +2 -2
  19. package/esm2022/lib/components/ecl-feedback-message/ecl-feedback-message.directive.mjs +2 -2
  20. package/esm2022/lib/components/ecl-icon/ecl-icon.component.mjs +19 -11
  21. package/esm2022/lib/components/ecl-link/ecl-link.directive.mjs +2 -2
  22. package/esm2022/lib/components/ecl-menu/ecl-menu/ecl-menu-item.component.mjs +4 -5
  23. package/esm2022/lib/components/ecl-menu/ecl-menu-mega/ecl-menu-mega-item.component.mjs +4 -4
  24. package/esm2022/lib/components/ecl-social-media-follow/ecl-social-media-follow-link.directive.mjs +2 -2
  25. package/esm2022/lib/components/ecl-social-media-share/ecl-social-media-share-link.directive.mjs +2 -2
  26. package/fesm2022/eui-ecl.mjs +210 -224
  27. package/fesm2022/eui-ecl.mjs.map +3 -3
  28. package/lib/components/ecl-accordion/ecl-accordion-item.component.d.ts +5 -3
  29. package/lib/components/ecl-accordion/ecl-accordion-item.component.d.ts.map +1 -1
  30. package/lib/components/ecl-accordion/ecl-accordion.component.d.ts +6 -4
  31. package/lib/components/ecl-accordion/ecl-accordion.component.d.ts.map +1 -1
  32. package/lib/components/ecl-base.directive.d.ts +1 -1
  33. package/lib/components/ecl-base.directive.d.ts.map +1 -1
  34. package/lib/components/ecl-button/ecl-button.component.d.ts.map +1 -1
  35. package/lib/components/ecl-carousel/ecl-carousel-item.component.d.ts +1 -0
  36. package/lib/components/ecl-carousel/ecl-carousel-item.component.d.ts.map +1 -1
  37. package/lib/components/ecl-carousel/ecl-carousel.component.d.ts.map +1 -1
  38. package/lib/components/ecl-icon/ecl-icon.component.d.ts +5 -3
  39. package/lib/components/ecl-icon/ecl-icon.component.d.ts.map +1 -1
  40. package/lib/components/ecl-link/ecl-link.directive.d.ts.map +1 -1
  41. package/lib/components/ecl-menu/ecl-menu/ecl-menu-item.component.d.ts +2 -3
  42. package/lib/components/ecl-menu/ecl-menu/ecl-menu-item.component.d.ts.map +1 -1
  43. package/lib/components/ecl-menu/ecl-menu-mega/ecl-menu-mega-item.component.d.ts.map +1 -1
  44. package/package.json +1 -1
@@ -117,12 +117,6 @@
117
117
 
118
118
 
119
119
 
120
- <p class="comment">
121
- <h3>Extends</h3>
122
- </p>
123
- <p class="comment">
124
- <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
125
- </p>
126
120
 
127
121
  <p class="comment">
128
122
  <h3>Implements</h3>
@@ -147,6 +141,8 @@
147
141
  <tr>
148
142
  <td class="col-md-3">HostDirectives</td>
149
143
  <td class="col-md-9">
144
+ <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
145
+ <br/>
150
146
  <code><a href="../directives/ECLClickOutsideDirective.html" target="_self" >ECLClickOutsideDirective</a></code>
151
147
  <br/>
152
148
  <div><i>&nbsp;Outputs</i> : eclClickOutside&nbsp;</div>
@@ -211,6 +207,10 @@
211
207
  <span class="modifier"></span>
212
208
  <a href="#accordionItems" >accordionItems</a>
213
209
  </li>
210
+ <li>
211
+ <span class="modifier">Public</span>
212
+ <a href="#baseDirective" >baseDirective</a>
213
+ </li>
214
214
  </ul>
215
215
  </td>
216
216
  </tr>
@@ -227,33 +227,10 @@
227
227
  <span class="modifier"></span>
228
228
  <a href="#onClickOutsideAccordion" >onClickOutsideAccordion</a>
229
229
  </li>
230
- <li>
231
- <a href="#getCssClasses" >getCssClasses</a>
232
- </li>
233
230
  </ul>
234
231
  </td>
235
232
  </tr>
236
233
 
237
- <tr>
238
- <td class="col-md-4">
239
- <h6><b>Inputs</b></h6>
240
- </td>
241
- </tr>
242
- <tr>
243
- <td class="col-md-4">
244
- <ul class="index-list">
245
- <li>
246
- <a href="#class" >class</a>
247
- </li>
248
- <li>
249
- <a href="#e2eAttr" >e2eAttr</a>
250
- </li>
251
- <li>
252
- <a href="#tabindex" >tabindex</a>
253
- </li>
254
- </ul>
255
- </td>
256
- </tr>
257
234
 
258
235
 
259
236
  <tr>
@@ -310,7 +287,7 @@
310
287
  <tbody>
311
288
  <tr>
312
289
  <td class="col-md-4">
313
- <code>constructor(cd: ChangeDetectorRef, differs: IterableDiffers)</code>
290
+ <code>constructor(baseDirective: <a href="../directives/ECLBaseDirective.html" target="_self">ECLBaseDirective</a>, cd: ChangeDetectorRef, differs: IterableDiffers)</code>
314
291
  </td>
315
292
  </tr>
316
293
 
@@ -327,6 +304,18 @@
327
304
  </tr>
328
305
  </thead>
329
306
  <tbody>
307
+ <tr>
308
+ <td>baseDirective</td>
309
+
310
+ <td>
311
+ <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
312
+ </td>
313
+
314
+ <td>
315
+ No
316
+ </td>
317
+
318
+ </tr>
330
319
  <tr>
331
320
  <td>cd</td>
332
321
 
@@ -360,57 +349,7 @@
360
349
  </table>
361
350
  </section>
362
351
 
363
- <section data-compodoc="block-inputs">
364
- <h3 id="inputs">Inputs</h3>
365
- <table class="table table-sm table-bordered">
366
- <tbody>
367
- <tr>
368
- <td class="col-md-4">
369
- <a name="class"></a>
370
- <b>class</b>
371
- </td>
372
- </tr>
373
- <tr>
374
- <td class="col-md-4">
375
- <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
376
352
 
377
- </td>
378
- </tr>
379
- </tbody>
380
- </table>
381
- <table class="table table-sm table-bordered">
382
- <tbody>
383
- <tr>
384
- <td class="col-md-4">
385
- <a name="e2eAttr"></a>
386
- <b>e2eAttr</b>
387
- </td>
388
- </tr>
389
- <tr>
390
- <td class="col-md-4">
391
- <i>Type : </i> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >any</a></code>
392
-
393
- </td>
394
- </tr>
395
- </tbody>
396
- </table>
397
- <table class="table table-sm table-bordered">
398
- <tbody>
399
- <tr>
400
- <td class="col-md-4">
401
- <a name="tabindex"></a>
402
- <b>tabindex</b>
403
- </td>
404
- </tr>
405
- <tr>
406
- <td class="col-md-4">
407
- <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank" >number</a></code>
408
-
409
- </td>
410
- </tr>
411
- </tbody>
412
- </table>
413
- </section>
414
353
 
415
354
  <section data-compodoc="block-properties">
416
355
  <h3>HostBindings</h3> <table class="table table-sm table-bordered">
@@ -505,67 +444,6 @@
505
444
  </tr>
506
445
  </tbody>
507
446
  </table>
508
- <table class="table table-sm table-bordered">
509
- <tbody>
510
- <tr>
511
- <td class="col-md-4">
512
- <a name="getCssClasses"></a>
513
- <span class="name">
514
- <span ><b>getCssClasses</b></span>
515
- <a href="#getCssClasses"><span class="icon ion-ios-link"></span></a>
516
- </span>
517
- </td>
518
- </tr>
519
- <tr>
520
- <td class="col-md-4">
521
- <code>getCssClasses(rootClass: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
522
- </td>
523
- </tr>
524
-
525
-
526
-
527
-
528
- <tr>
529
- <td class="col-md-4">
530
-
531
- <div class="io-description">
532
- <b>Parameters :</b>
533
-
534
- <table class="params">
535
- <thead>
536
- <tr>
537
- <td>Name</td>
538
- <td>Type</td>
539
- <td>Optional</td>
540
- </tr>
541
- </thead>
542
- <tbody>
543
- <tr>
544
- <td>rootClass</td>
545
- <td>
546
- <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
547
- </td>
548
-
549
- <td>
550
- No
551
- </td>
552
-
553
-
554
- </tr>
555
- </tbody>
556
- </table>
557
- </div>
558
- <div class="io-description">
559
- <b>Returns : </b> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
560
-
561
- </div>
562
- <div class="io-description">
563
-
564
- </div>
565
- </td>
566
- </tr>
567
- </tbody>
568
- </table>
569
447
  </section>
570
448
  <section data-compodoc="block-properties">
571
449
 
@@ -601,6 +479,28 @@
601
479
  </tr>
602
480
 
603
481
 
482
+ </tbody>
483
+ </table>
484
+ <table class="table table-sm table-bordered">
485
+ <tbody>
486
+ <tr>
487
+ <td class="col-md-4">
488
+ <a name="baseDirective"></a>
489
+ <span class="name">
490
+ <span class="modifier">Public</span>
491
+ <span ><b>baseDirective</b></span>
492
+ <a href="#baseDirective"><span class="icon ion-ios-link"></span></a>
493
+ </span>
494
+ </td>
495
+ </tr>
496
+ <tr>
497
+ <td class="col-md-4">
498
+ <i>Type : </i> <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
499
+
500
+ </td>
501
+ </tr>
502
+
503
+
604
504
  </tbody>
605
505
  </table>
606
506
  </section>
@@ -117,12 +117,6 @@
117
117
 
118
118
 
119
119
 
120
- <p class="comment">
121
- <h3>Extends</h3>
122
- </p>
123
- <p class="comment">
124
- <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
125
- </p>
126
120
 
127
121
  <p class="comment">
128
122
  <h3>Implements</h3>
@@ -143,6 +137,13 @@
143
137
  </tr>
144
138
 
145
139
 
140
+ <tr>
141
+ <td class="col-md-3">HostDirectives</td>
142
+ <td class="col-md-9">
143
+ <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
144
+ <br/>
145
+ </td>
146
+ </tr>
146
147
 
147
148
 
148
149
 
@@ -198,6 +199,10 @@
198
199
  <tr>
199
200
  <td class="col-md-4">
200
201
  <ul class="index-list">
202
+ <li>
203
+ <span class="modifier">Public</span>
204
+ <a href="#baseDirective" >baseDirective</a>
205
+ </li>
201
206
  <li>
202
207
  <a href="#contentId" >contentId</a>
203
208
  </li>
@@ -225,9 +230,6 @@
225
230
  <li>
226
231
  <a href="#removeActiveStatus" >removeActiveStatus</a>
227
232
  </li>
228
- <li>
229
- <a href="#getCssClasses" >getCssClasses</a>
230
- </li>
231
233
  </ul>
232
234
  </td>
233
235
  </tr>
@@ -246,15 +248,6 @@
246
248
  <li>
247
249
  <a href="#label" >label</a>
248
250
  </li>
249
- <li>
250
- <a href="#class" >class</a>
251
- </li>
252
- <li>
253
- <a href="#e2eAttr" >e2eAttr</a>
254
- </li>
255
- <li>
256
- <a href="#tabindex" >tabindex</a>
257
- </li>
258
251
  </ul>
259
252
  </td>
260
253
  </tr>
@@ -314,7 +307,7 @@
314
307
  <tbody>
315
308
  <tr>
316
309
  <td class="col-md-4">
317
- <code>constructor(cd: ChangeDetectorRef)</code>
310
+ <code>constructor(baseDirective: <a href="../directives/ECLBaseDirective.html" target="_self">ECLBaseDirective</a>, cd: ChangeDetectorRef)</code>
318
311
  </td>
319
312
  </tr>
320
313
 
@@ -331,6 +324,18 @@
331
324
  </tr>
332
325
  </thead>
333
326
  <tbody>
327
+ <tr>
328
+ <td>baseDirective</td>
329
+
330
+ <td>
331
+ <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
332
+ </td>
333
+
334
+ <td>
335
+ No
336
+ </td>
337
+
338
+ </tr>
334
339
  <tr>
335
340
  <td>cd</td>
336
341
 
@@ -391,54 +396,6 @@
391
396
  </tr>
392
397
  </tbody>
393
398
  </table>
394
- <table class="table table-sm table-bordered">
395
- <tbody>
396
- <tr>
397
- <td class="col-md-4">
398
- <a name="class"></a>
399
- <b>class</b>
400
- </td>
401
- </tr>
402
- <tr>
403
- <td class="col-md-4">
404
- <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
405
-
406
- </td>
407
- </tr>
408
- </tbody>
409
- </table>
410
- <table class="table table-sm table-bordered">
411
- <tbody>
412
- <tr>
413
- <td class="col-md-4">
414
- <a name="e2eAttr"></a>
415
- <b>e2eAttr</b>
416
- </td>
417
- </tr>
418
- <tr>
419
- <td class="col-md-4">
420
- <i>Type : </i> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >any</a></code>
421
-
422
- </td>
423
- </tr>
424
- </tbody>
425
- </table>
426
- <table class="table table-sm table-bordered">
427
- <tbody>
428
- <tr>
429
- <td class="col-md-4">
430
- <a name="tabindex"></a>
431
- <b>tabindex</b>
432
- </td>
433
- </tr>
434
- <tr>
435
- <td class="col-md-4">
436
- <i>Type : </i> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/number" target="_blank" >number</a></code>
437
-
438
- </td>
439
- </tr>
440
- </tbody>
441
- </table>
442
399
  </section>
443
400
  <section data-compodoc="block-outputs">
444
401
  <h3 id="outputs">Outputs</h3>
@@ -581,73 +538,34 @@
581
538
  </tr>
582
539
  </tbody>
583
540
  </table>
541
+ </section>
542
+ <section data-compodoc="block-properties">
543
+
544
+ <h3 id="inputs">
545
+ Properties
546
+ </h3>
584
547
  <table class="table table-sm table-bordered">
585
548
  <tbody>
586
549
  <tr>
587
550
  <td class="col-md-4">
588
- <a name="getCssClasses"></a>
551
+ <a name="baseDirective"></a>
589
552
  <span class="name">
590
- <span ><b>getCssClasses</b></span>
591
- <a href="#getCssClasses"><span class="icon ion-ios-link"></span></a>
553
+ <span class="modifier">Public</span>
554
+ <span ><b>baseDirective</b></span>
555
+ <a href="#baseDirective"><span class="icon ion-ios-link"></span></a>
592
556
  </span>
593
557
  </td>
594
558
  </tr>
595
- <tr>
596
- <td class="col-md-4">
597
- <code>getCssClasses(rootClass: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
598
- </td>
599
- </tr>
600
-
601
-
602
-
603
-
604
- <tr>
605
- <td class="col-md-4">
606
-
607
- <div class="io-description">
608
- <b>Parameters :</b>
609
-
610
- <table class="params">
611
- <thead>
612
- <tr>
613
- <td>Name</td>
614
- <td>Type</td>
615
- <td>Optional</td>
616
- </tr>
617
- </thead>
618
- <tbody>
619
- <tr>
620
- <td>rootClass</td>
621
- <td>
622
- <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
623
- </td>
559
+ <tr>
560
+ <td class="col-md-4">
561
+ <i>Type : </i> <code><a href="../directives/ECLBaseDirective.html" target="_self" >ECLBaseDirective</a></code>
624
562
 
625
- <td>
626
- No
627
- </td>
563
+ </td>
564
+ </tr>
628
565
 
629
566
 
630
- </tr>
631
- </tbody>
632
- </table>
633
- </div>
634
- <div class="io-description">
635
- <b>Returns : </b> <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
636
-
637
- </div>
638
- <div class="io-description">
639
-
640
- </div>
641
- </td>
642
- </tr>
643
567
  </tbody>
644
568
  </table>
645
- </section>
646
- <section data-compodoc="block-properties">
647
-
648
- <h3 id="inputs">
649
- Properties
650
- </h3>
651
569
  <table class="table table-sm table-bordered">
652
570
  <tbody>
653
571
  <tr>
@@ -2134,7 +2134,7 @@
2134
2134
  <script src="../js/libs/htmlparser.js"></script>
2135
2135
  <script src="../js/libs/deep-iterator.js"></script>
2136
2136
  <script>
2137
- var COMPONENT_TEMPLATE = '<div><div #carouselContainer class="ecl-carousel__container" [class.ecl-carousel-container--padded]="isPadded()"> <div #slidesContainer (keyup)="onFirstCarouselElementPress($event)" class="ecl-carousel__slides" [style.width.px]="getCarouselSlidesWidth()" [style.left.px]="!isRtl ? getCarouselSlidesOffsetLeft() : null" [style.right.px]="isRtl ? getCarouselSlidesOffsetRight() : null" [style.transition-duration.s]="transitionDuration" (mouseover)="onSlideHover()" (mouseout)="onSlideHoverout()"> @if(hasControls()){ <ecl-carousel-item #firstHiddenItem [style.width.%]="slideWidth"></ecl-carousel-item> } <ng-content></ng-content> @if(hasControls()){ <ecl-carousel-item #lastHiddenItem [style.width.%]="slideWidth"></ecl-carousel-item> } </div></div>@if(isButtonNavVisible) {<button #prevButton class="ecl-button ecl-button--ghost ecl-carousel__prev ecl-button--icon-only" type="button" (click)="onPreviousSlideClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.NEXT-SLIDES\' | translate }} </span> <ecl-icon icon="corner-arrow" size="m" transform="rotate-270" class="ecl-button__icon"> </ecl-icon> </span></button>}@if(hasControls()){<div class="ecl-carousel__controls"> <div class="ecl-container"> <div class="ecl-carousel__autoplay"> <button #playButton class="ecl-button ecl-button--ghost ecl-carousel__play ecl-button--icon-only" type="button" [style.display]="isPlaying ? \'none\' : \'flex\'" (keydown)="onPlayKeyboardPress($event)" (click)="onPlayClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.PLAY\' | translate }} </span> <ecl-icon icon="play-outline" size="m" class="ecl-button__icon ecl-carousel__icon-default"> </ecl-icon> </span> </button> <button #pauseButton class="ecl-button ecl-button--ghost ecl-carousel__pause ecl-button--icon-only" type="button" [style.display]="isPlaying ? \'flex\' : \'none\'" (keydown)="onPlayKeyboardPress($event)" (click)="onPauseClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.PAUSE\' | translate }} </span> <ecl-icon icon="pause" size="m" class="ecl-button__icon ecl-carousel__icon-default"> </ecl-icon> </span> </button> </div> <div class="ecl-carousel__navigation"> @for (slide of slides; let i = $index; track slide) { <button #currButton [attr.aria-current]="i === getCurrentSlideIndex()" class="ecl-button ecl-button--ghost ecl-carousel__navigation-item" (click)="onSlideControlClick(slide)" (keydown)="onNavBtnKeyboardPress($event, i)"> {{ i + 1 }} </button> } </div> </div></div>}@if(isButtonNavVisible) {<button #nextButton class="ecl-button ecl-button--ghost ecl-carousel__next ecl-button--icon-only" type="button" (click)="onNextSlideClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.NEXT-SLIDES\' | translate }} </span> <ecl-icon icon="corner-arrow" size="m" transform="rotate-90" class="ecl-button__icon"> </ecl-icon> </span></button>}</div>'
2137
+ var COMPONENT_TEMPLATE = '<div><div #carouselContainer class="ecl-carousel__container" [class.ecl-carousel-container--padded]="isPadded()"> <div #slidesContainer (keyup)="onFirstCarouselElementPress($event)" class="ecl-carousel__slides" [style.width.px]="getCarouselSlidesWidth()" [style.left.px]="!isRtl ? getCarouselSlidesOffsetLeft() : null" [style.right.px]="isRtl ? getCarouselSlidesOffsetRight() : null" [style.transition-duration.s]="transitionDuration" (mouseover)="onSlideHover()" (mouseout)="onSlideHoverout()"> @if(hasControls()){ <ecl-carousel-item #firstHiddenItem [style.width.%]="slideWidth"></ecl-carousel-item> } <ng-content></ng-content> @if(hasControls()){ <ecl-carousel-item #lastHiddenItem [style.width.%]="slideWidth"></ecl-carousel-item> } </div></div>@if(isButtonNavVisible) {<button #prevButton class="ecl-button ecl-button--ghost ecl-carousel__prev ecl-button--icon-only" type="button" (click)="onPreviousSlideClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.NEXT-SLIDES\' | translate }} </span> <ecl-icon icon="corner-arrow" size="m" transform="rotate-270" class="ecl-button__icon"> </ecl-icon> </span></button><button #nextButton class="ecl-button ecl-button--ghost ecl-carousel__next ecl-button--icon-only" type="button" (click)="onNextSlideClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.NEXT-SLIDES\' | translate }} </span> <ecl-icon icon="corner-arrow" size="m" transform="rotate-90" class="ecl-button__icon"> </ecl-icon> </span></button>}@if(hasControls()){<div class="ecl-carousel__controls"> <div class="ecl-container"> <div class="ecl-carousel__autoplay"> <button #playButton class="ecl-button ecl-button--ghost ecl-carousel__play ecl-button--icon-only" type="button" [style.display]="isPlaying ? \'none\' : \'flex\'" (keydown)="onPlayKeyboardPress($event)" (click)="onPlayClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.PLAY\' | translate }} </span> <ecl-icon icon="play-outline" size="m" class="ecl-button__icon ecl-carousel__icon-default"> </ecl-icon> </span> </button> <button #pauseButton class="ecl-button ecl-button--ghost ecl-carousel__pause ecl-button--icon-only" type="button" [style.display]="isPlaying ? \'flex\' : \'none\'" (keydown)="onPlayKeyboardPress($event)" (click)="onPauseClick()"> <span class="ecl-button__container"> <span class="ecl-button__label"> {{ \'ecl.carousel.PAUSE\' | translate }} </span> <ecl-icon icon="pause" size="m" class="ecl-button__icon ecl-carousel__icon-default"> </ecl-icon> </span> </button> </div> <div class="ecl-carousel__navigation"> @for (slide of slides; let i = $index; track slide) { <button #currButton [attr.aria-current]="i === getCurrentSlideIndex()" class="ecl-button ecl-button--ghost ecl-carousel__navigation-item" (click)="onSlideControlClick(slide)" (keydown)="onNavBtnKeyboardPress($event, i)"> {{ i + 1 }} </button> } </div> </div></div>}</div>'
2138
2138
  var COMPONENTS = [{'name': 'EclAccordionComponent', 'selector': 'ecl-accordion'},{'name': 'EclAccordionItemComponent', 'selector': 'ecl-accordion-item'},{'name': 'EclAppComponent', 'selector': 'ecl-app'},{'name': 'EclBannerComponent', 'selector': 'ecl-banner'},{'name': 'EclBlockquoteComponent', 'selector': '[eclBlockquote]'},{'name': 'EclBreadcrumbComponent', 'selector': 'ecl-breadcrumb'},{'name': 'EclBreadcrumbSegmentComponent', 'selector': 'ecl-breadcrumb-segment'},{'name': 'EclButtonComponent', 'selector': 'button[eclButton], button[ecl-button], a[eclButton]'},{'name': 'EclCardBodyComponent', 'selector': 'ecl-card-body'},{'name': 'EclCardComponent', 'selector': 'ecl-card'},{'name': 'EclCarouselComponent', 'selector': 'ecl-carousel'},{'name': 'EclCarouselItemComponent', 'selector': 'ecl-carousel-item'},{'name': 'EclCategoryFilterComponent', 'selector': 'ecl-category-filter'},{'name': 'EclCategoryFilterItemComponent', 'selector': 'ecl-category-filter-item'},{'name': 'EclCategoryFilterListComponent', 'selector': 'ecl-category-filter-list'},{'name': 'EclCheckboxHelpComponent', 'selector': '[eclCheckboxHelp]'},{'name': 'EclCheckboxLabelComponent', 'selector': 'label[eclCheckboxLabel]'},{'name': 'EclContentBlockComponent', 'selector': 'ecl-content-block'},{'name': 'EclContentItemComponent', 'selector': 'ecl-content-item'},{'name': 'EclDateBlockComponent', 'selector': 'time[eclDateBlock]'},{'name': 'EclDescriptionListDefinitionComponent', 'selector': '[eclDescriptionListDefinition]'},{'name': 'EclExpandableComponent', 'selector': 'ecl-expandable'},{'name': 'EclFactFiguresComponent', 'selector': 'ecl-fact-figures'},{'name': 'EclFactFiguresDescriptionComponent', 'selector': 'ecl-fact-figures-description'},{'name': 'EclFactFiguresItemComponent', 'selector': 'ecl-fact-figures-item'},{'name': 'EclFactFiguresTitleComponent', 'selector': 'ecl-fact-figures-title'},{'name': 'EclFactFiguresValueComponent', 'selector': 'ecl-fact-figures-value'},{'name': 'EclFactFiguresViewAllComponent', 'selector': 'ecl-fact-figures-view-all'},{'name': 'EclFeaturedComponent', 'selector': 'ecl-featured'},{'name': 'EclFeaturedItemComponent', 'selector': 'ecl-featured-item'},{'name': 'EclFeaturedItemDescriptionComponent', 'selector': 'ecl-featured-item-description'},{'name': 'EclFeaturedItemFooterComponent', 'selector': '[eclFeaturedItemFooter]'},{'name': 'EclFileComponent', 'selector': 'ecl-file'},{'name': 'EclFileItemComponent', 'selector': 'ecl-file-item'},{'name': 'EclFileItemsComponent', 'selector': 'ecl-file-items'},{'name': 'EclFileTaxonomyComponent', 'selector': 'ecl-file-taxonomy'},{'name': 'EclFormGroupComponent', 'selector': '[eclFormGroup], ecl-form-group'},{'name': 'EclFormLabelComponent', 'selector': '[eclFormLabel]'},{'name': 'EclGalleryComponent', 'selector': 'ecl-gallery'},{'name': 'EclGalleryFooterComponent', 'selector': 'ecl-gallery-footer'},{'name': 'EclGalleryItemComponent', 'selector': 'ecl-gallery-item'},{'name': 'EclIconComponent', 'selector': 'ecl-icon'},{'name': 'EclInpageNavigationComponent', 'selector': 'ecl-inpage-navigation'},{'name': 'EclInpageNavigationItemComponent', 'selector': 'ecl-inpage-navigation-item'},{'name': 'EclListIllustrationComponent', 'selector': 'ecl-list-illustration'},{'name': 'EclListIllustrationItemComponent', 'selector': 'ecl-list-illustration-item'},{'name': 'EclLoadingIndicatorComponent', 'selector': 'ecl-loading-indicator'},{'name': 'EclMediaContainerComponent', 'selector': 'ecl-media-container'},{'name': 'EclMenuComponent', 'selector': 'ecl-menu'},{'name': 'EclMenuItemComponent', 'selector': 'ecl-menu-item'},{'name': 'EclMenuMegaComponent', 'selector': 'ecl-menu-mega'},{'name': 'EclMenuMegaItemComponent', 'selector': 'ecl-menu-mega-item'},{'name': 'EclModalBodyComponent', 'selector': '[eclModalBody]'},{'name': 'EclModalComponent', 'selector': 'dialog[eclModal]'},{'name': 'EclModalFooterComponent', 'selector': '[eclModalFooter]'},{'name': 'EclModalHeaderComponent', 'selector': '[eclModalHeader]'},{'name': 'EclMultiselectComponent', 'selector': 'select[eclMultiselect]'},{'name': 'EclMultiselectDropdownComponent', 'selector': 'div[eclMultiselectDropdown]'},{'name': 'EclMultiselectInputComponent', 'selector': 'div[eclMultiselectInput]'},{'name': 'EclMultiselectOptgroupComponent', 'selector': 'fieldset[eclMultiselectOptgroup]'},{'name': 'EclMultiselectOptionComponent', 'selector': 'div[eclMultiselectOption]'},{'name': 'EclNavigationListComponent', 'selector': 'ecl-navigation-list'},{'name': 'EclNavigationListImageComponent', 'selector': 'div[eclNavigationListImage]'},{'name': 'EclNavigationListItemComponent', 'selector': 'ecl-navigation-list-item'},{'name': 'EclNewsTickerComponent', 'selector': 'ecl-news-ticker'},{'name': 'EclNewsTickerItemComponent', 'selector': 'ecl-news-ticker-item'},{'name': 'EclNotificationComponent', 'selector': 'ecl-notification'},{'name': 'EclPageHeaderComponent', 'selector': 'ecl-page-header'},{'name': 'EclPaginationComponent', 'selector': 'ecl-pagination'},{'name': 'EclPaginationItemComponent', 'selector': 'ecl-pagination-item'},{'name': 'EclPopoverComponent', 'selector': 'ecl-popover'},{'name': 'EclRadioHelpComponent', 'selector': '[eclRadioHelp]'},{'name': 'EclRadioLabelComponent', 'selector': '[eclRadioLabel]'},{'name': 'EclRangeValueComponent', 'selector': 'ecl-range-value'},{'name': 'EclRatingFieldComponent', 'selector': 'ecl-rating-field'},{'name': 'EclSearchFormComponent', 'selector': 'ecl-search-form'},{'name': 'EclSelectContainerComponent', 'selector': 'ecl-select-container'},{'name': 'EclSiteFooterComponent', 'selector': 'ecl-site-footer'},{'name': 'EclSiteFooterFixedContentECComponent', 'selector': 'ecl-site-footer-fixed-content-ec'},{'name': 'EclSiteFooterFixedContentEUComponent', 'selector': 'ecl-site-footer-fixed-content-eu'},{'name': 'EclSiteHeaderActionComponent', 'selector': 'ecl-site-header-action'},{'name': 'EclSiteHeaderBannerTopComponent', 'selector': 'ecl-site-header-banner-top'},{'name': 'EclSiteHeaderComponent', 'selector': 'ecl-site-header'},{'name': 'EclSiteHeaderEnvironmentComponent', 'selector': '[eclSiteHeaderEnvironment]'},{'name': 'EclSiteHeaderLanguageComponent', 'selector': 'ecl-site-header-language'},{'name': 'EclSiteHeaderLanguagePopoverComponent', 'selector': 'ecl-site-header-language-popover'},{'name': 'EclSiteHeaderLoginComponent', 'selector': 'ecl-site-header-login'},{'name': 'EclSiteHeaderNotificationComponent', 'selector': 'ecl-site-header-notification'},{'name': 'EclSiteHeaderSearchComponent', 'selector': 'ecl-site-header-search'},{'name': 'EclSocialMediaFollowComponent', 'selector': 'ecl-social-media-follow'},{'name': 'EclSocialMediaFollowItemComponent', 'selector': 'ecl-social-media-follow-item'},{'name': 'EclSocialMediaShareComponent', 'selector': 'ecl-social-media-share'},{'name': 'EclSocialMediaShareItemComponent', 'selector': 'ecl-social-media-share-item'},{'name': 'EclStickyContainerComponent', 'selector': 'ecl-sticky-container'},{'name': 'EclTabComponent', 'selector': 'ecl-tab, [eclTab]'},{'name': 'EclTabLabelComponent', 'selector': 'ecl-tab-label'},{'name': 'EclTableSortButtonComponent', 'selector': 'button[eclTableSortButton]'},{'name': 'EclTabMoreComponent', 'selector': 'ecl-tab-more'},{'name': 'EclTabsComponent', 'selector': 'nav[eclTabs], ecl-tabs'},{'name': 'EclTagComponent', 'selector': 'ecl-tag, [eclTag]'},{'name': 'EclTimelineComponent', 'selector': 'ecl-timeline'},{'name': 'EclTimelineItemComponent', 'selector': 'ecl-timeline-item'},{'name': 'EclTimelineItemTogglerComponent', 'selector': 'ecl-timeline-item-toggler'}];
2139
2139
  var DIRECTIVES = [{'name': 'EclBannerDescriptionDirective', 'selector': '[eclBannerDescription]'},{'name': 'EclBannerDescriptionTextDirective', 'selector': '[eclBannerDescriptionText]'},{'name': 'EclBannerImageDirective', 'selector': 'img[eclBannerImage]'},{'name': 'EclBannerPictureDirective', 'selector': 'picture[eclBannerPicture]'},{'name': 'EclBannerTitleDirective', 'selector': '[eclBannerTitle]'},{'name': 'EclBannerTitleTextDirective', 'selector': '[eclBannerTitleText]'},{'name': 'ECLBaseDirective', 'selector': '[eclBase]'},{'name': 'EclBlockquoteImageDirective', 'selector': 'img[eclBlockquoteImage]'},{'name': 'EclBlockquotePictureDirective', 'selector': 'picture[eclBlockquotePicture]'},{'name': 'EclButtonLabelDirective', 'selector': '[eclButtonLabel]'},{'name': 'EclCardImageDirective', 'selector': 'img[eclCardImage]'},{'name': 'EclCardPictureDirective', 'selector': 'picture[eclCardPicture]'},{'name': 'EclCheckboxDirective', 'selector': '[eclCheckbox]'},{'name': 'EclCheckboxInputDirective', 'selector': 'input[eclCheckboxInput]'},{'name': 'ECLClickOutsideDirective', 'selector': '[eclClickOutside]'},{'name': 'EclContentBlockDescriptionDirective', 'selector': '[eclContentBlockDescription]'},{'name': 'EclContentBlockLabelDirective', 'selector': '[eclContentBlockLabel]'},{'name': 'EclContentBlockLabelsDirective', 'selector': '[eclContentBlockLabels]'},{'name': 'EclContentBlockLinkDirective', 'selector': '[eclContentBlockLink]'},{'name': 'EclContentBlockLinksContainerDirective', 'selector': '[eclContentBlockLinksContainer]'},{'name': 'EclContentBlockLinksDirective', 'selector': '[eclContentBlockLinks]'},{'name': 'EclContentBlockListContainerDirective', 'selector': '[eclContentBlockListContainer]'},{'name': 'EclContentBlockListDirective', 'selector': '[eclContentBlockList]'},{'name': 'EclContentBlockPrimaryMetaDirective', 'selector': '[eclContentBlockPrimaryMeta]'},{'name': 'EclContentBlockPrimaryMetasDirective', 'selector': '[eclContentBlockPrimaryMetas]'},{'name': 'EclContentBlockSecondaryMetaDirective', 'selector': '[eclContentBlockSecondaryMeta]'},{'name': 'EclContentBlockSecondaryMetaIconDirective', 'selector': '[eclContentBlockSecondaryMetaIcon]'},{'name': 'EclContentBlockSecondaryMetaLabelDirective', 'selector': '[eclContentBlockSecondaryMetaLabel]'},{'name': 'EclContentBlockSecondaryMetasDirective', 'selector': '[eclContentBlockSecondaryMetas]'},{'name': 'EclContentBlockTagDirective', 'selector': '[eclContentBlockTag]'},{'name': 'EclContentBlockTagsDirective', 'selector': '[eclContentBlockTags]'},{'name': 'EclContentBlockTitleDirective', 'selector': '[eclContentBlockTitle]'},{'name': 'EclContentItemImageDirective', 'selector': '[eclContentItemImage]'},{'name': 'EclContentItemPictureDirective', 'selector': '[eclContentItemPicture]'},{'name': 'EclDatePickerDirective', 'selector': 'input[eclDatePicker]'},{'name': 'EclDescriptionListDefinitionItemDirective', 'selector': '[eclDescriptionListDefinitionItem]'},{'name': 'EclDescriptionListDefinitionListDirective', 'selector': '[eclDescriptionListDefinitionList]'},{'name': 'EclDescriptionListDirective', 'selector': '[eclDescriptionList]'},{'name': 'EclDescriptionListTermDirective', 'selector': '[eclDescriptionListTerm]'},{'name': 'EclFeaturedItemFooterLinkDirective', 'selector': '[eclFeaturedItemFooterLink]'},{'name': 'EclFeaturedItemFooterPictureDirective', 'selector': 'picture[eclFeaturedItemFooterPicture]'},{'name': 'EclFeaturedItemLinkDirective', 'selector': '[eclFeaturedItemLink]'},{'name': 'EclFeedbackMessageDirective', 'selector': '[eclFeedbackMessage]'},{'name': 'EclFileDownloadDirective', 'selector': '[eclFileDownload]'},{'name': 'EclFileImageDirective', 'selector': 'img[eclFileImage]'},{'name': 'EclFilePictureDirective', 'selector': 'picture[eclFilePicture]'},{'name': 'EclFileTitleDirective', 'selector': '[eclFileTitle]'},{'name': 'EclFileTranslationDownloadDirective', 'selector': '[eclFileTranslationDownload]'},{'name': 'EclFileUploadDirective', 'selector': '[eclFileUpload]'},{'name': 'EclGalleryMediaDirective', 'selector': '[eclGalleryMedia], [eclGalleryImage]'},{'name': 'EclGalleryPictureDirective', 'selector': 'picture[eclGalleryPicture]'},{'name': 'EclHelpBlockDirective', 'selector': '[eclHelpBlock]'},{'name': 'EclHiddenDirective', 'selector': '[eclHidden]'},{'name': 'EclLabelDirective', 'selector': '[eclLabel]'},{'name': 'EclLinkDirective', 'selector': '[eclLink]'},{'name': 'EclLinkLabelDirective', 'selector': '[eclLinkLabel]'},{'name': 'EclListIllustrationIconDirective', 'selector': '[eclListIllustrationIcon]'},{'name': 'EclListIllustrationImageDirective', 'selector': 'img[eclListIllustrationImage]'},{'name': 'EclListIllustrationPictureDirective', 'selector': 'picture[eclListIllustrationPicture]'},{'name': 'EclLoadingIndicatorLabelDirective', 'selector': '[eclLoadingIndicatorLabel]'},{'name': 'EclLoadingIndicatorOverlayDirective', 'selector': '[eclLoadingIndicatorOverlay]'},{'name': 'EclMediaContainerIframeDirective', 'selector': 'iframe[eclMediaContainerIframe]'},{'name': 'EclMediaContainerItemDirective', 'selector': '[eclMediaContainerItem], img[eclMediaContainerImage]'},{'name': 'EclMediaContainerPictureDirective', 'selector': 'picture[eclMediaContainerPicture]'},{'name': 'EclModalBodyFixedContentDirective', 'selector': '[eclModalBodyFixedContent]'},{'name': 'EclModalCloseDirective', 'selector': '[eclModalClose]'},{'name': 'EclModalTriggerDirective', 'selector': '[eclModalTriggerFor]'},{'name': 'EclMultiselectOptionDirective', 'selector': 'optgroup[eclMultiselectOptgroup], option[eclMultiselectOption]'},{'name': 'EclNavigationListImageDirective', 'selector': 'img[eclNavigationListImage]'},{'name': 'EclNavigationListPictureDirective', 'selector': 'picture[eclNavigationListPicture]'},{'name': 'EclNotificationTitleDirective', 'selector': '[eclNotificationTitle]'},{'name': 'EclOrderedListDirective', 'selector': '[eclOrderedList]'},{'name': 'EclOrderedListItemDirective', 'selector': '[eclOrderedListItem]'},{'name': 'EclPageHeaderBackgroundImageDirective', 'selector': '[eclPageHeaderBackgroundImage]'},{'name': 'EclPageHeaderBackgroundPictureDirective', 'selector': '[eclPageHeaderBackgroundPicture]'},{'name': 'EclPageHeaderDescriptionContainerDirective', 'selector': '[eclPageHeaderDescriptionContainer]'},{'name': 'EclPageHeaderDescriptionDirective', 'selector': '[eclPageHeaderDescription]'},{'name': 'EclPageHeaderDescriptionPictureDirective', 'selector': '[eclPageHeaderDescriptionPicture]'},{'name': 'EclPageHeaderDescriptionThumbnailDirective', 'selector': '[eclPageHeaderDescriptionThumbnail], img[eclPageHeaderDescriptionImage] '},{'name': 'EclPageHeaderInfoDirective', 'selector': '[eclPageHeaderInfo]'},{'name': 'EclPageHeaderMetaDirective', 'selector': '[eclPageHeaderMeta]'},{'name': 'EclPageHeaderMetaItemDirective', 'selector': '[eclPageHeaderMetaItem]'},{'name': 'EclPageHeaderTitleDirective', 'selector': '[eclPageHeaderTitle]'},{'name': 'EclPopoverContentDirective', 'selector': '[eclPopoverContent]'},{'name': 'EclPopoverToggleDirective', 'selector': '[eclPopoverToggle]'},{'name': 'EclRadioDirective', 'selector': '[eclRadio]'},{'name': 'EclRadioInputDirective', 'selector': 'input[eclRadioInput]'},{'name': 'EclRangeDirective', 'selector': 'input[eclRange]'},{'name': 'EclSelectDirective', 'selector': 'select[eclSelect]'},{'name': 'EclSiteFooterColumnDirective', 'selector': '[eclSiteFooterColumn]'},{'name': 'EclSiteFooterContentDirective', 'selector': '[eclSiteFooterContent]'},{'name': 'EclSiteFooterDescriptionDirective', 'selector': '[eclSiteFooterDescription]'},{'name': 'EclSiteFooterLinkDirective', 'selector': '[eclSiteFooterLink]'},{'name': 'EclSiteFooterListDirective', 'selector': '[eclSiteFooterList]'},{'name': 'EclSiteFooterListItemDirective', 'selector': '[eclSiteFooterListItem]'},{'name': 'EclSiteFooterLogoDirective', 'selector': '[eclSiteFooterLogo]'},{'name': 'EclSiteFooterLogoImageDirective', 'selector': 'img[eclSiteFooterLogoImage]'},{'name': 'EclSiteFooterLogoItemDirective', 'selector': '[eclSiteFooterLogoItem]'},{'name': 'EclSiteFooterLogoLinkDirective', 'selector': '[eclSiteFooterLogoLink]'},{'name': 'EclSiteFooterLogoListDirective', 'selector': '[eclSiteFooterLogoList]'},{'name': 'EclSiteFooterPictureDirective', 'selector': 'picture[eclSiteFooterPicture]'},{'name': 'EclSiteFooterRowDirective', 'selector': '[eclSiteFooterRow]'},{'name': 'EclSiteFooterSectionDirective', 'selector': '[eclSiteFooterSection]'},{'name': 'EclSiteFooterTitleDirective', 'selector': '[eclSiteFooterTitle]'},{'name': 'EclSiteFooterTitleLinkDirective', 'selector': '[eclSiteFooterTitleLink]'},{'name': 'EclSiteHeaderCtaDirective', 'selector': '[eclSiteHeaderCta]'},{'name': 'EclSiteHeaderImageDirective', 'selector': '[eclSiteHeaderImage]'},{'name': 'EclSiteHeaderLinkDirective', 'selector': '[eclSiteHeaderLink]'},{'name': 'EclSiteHeaderLoginDescriptionDirective', 'selector': '[eclSiteHeaderLoginDescription]'},{'name': 'EclSiteHeaderLoginSeparatorDirective', 'selector': '[eclSiteHeaderLoginSeparator]'},{'name': 'EclSiteHeaderPictureDirective', 'selector': '[eclSiteHeaderPicture]'},{'name': 'EclSocialMediaFollowLinkDirective', 'selector': '[eclSocialMediaFollowLink]'},{'name': 'EclSocialMediaShareLinkDirective', 'selector': '[eclSocialMediaShareLink]'},{'name': 'EclTableBodyDirective', 'selector': '[eclTableBody]'},{'name': 'EclTableCellDirective', 'selector': '[eclTableCell]'},{'name': 'EclTableCellGroupDirective', 'selector': '[eclTableCellGroup]'},{'name': 'EclTableDirective', 'selector': '[eclTable]'},{'name': 'EclTableHeadDirective', 'selector': '[eclTableHead]'},{'name': 'EclTableHeaderDirective', 'selector': '[eclTableHeader]'},{'name': 'EclTableResponsiveDirective', 'selector': '[eclTableResponsive]'},{'name': 'EclTableRowDirective', 'selector': '[eclTableRow]'},{'name': 'EclTagSetDirective', 'selector': '[eclTagSet]'},{'name': 'EclTextAreaDirective', 'selector': 'textarea[eclTextArea]'},{'name': 'EclTextInputDirective', 'selector': 'input[eclTextInput]'},{'name': 'EclTimelineItemLabelDirective', 'selector': '[eclTimelineItemLabel]'},{'name': 'EclTimelineItemTitleDirective', 'selector': '[eclTimelineItemTitle]'},{'name': 'EclUnorderedListDirective', 'selector': '[eclUnorderedList]'},{'name': 'EclUnorderedListItemDirective', 'selector': '[eclUnorderedListItem]'}];
2140
2140
  var ACTUAL_COMPONENT = {'name': 'EclCarouselComponent'};