@eui/ecl 22.0.0-alpha.51 → 22.0.0-alpha.53

package/types/eui-ecl-components-ecl-carousel.d.ts

@@ -1,6 +1,7 @@
 import * as _angular_core from '@angular/core';
-import { WritableSignal, Signal, ElementRef, OnInit, OnDestroy, AfterContentInit } from '@angular/core';
+import { WritableSignal, Signal, OnInit, OnDestroy, AfterContentInit, ElementRef } from '@angular/core';
 import { EclBaseEvent, ECLBaseDirective } from '@eui/ecl/core';
+import { EmblaOptionsType, EmblaPluginType, EmblaEventType } from 'embla-carousel';
 
 /**
  * Interface implemented by `EclCarouselItemComponent`.
@@ -28,78 +29,23 @@ declare class EclSlideEvent extends EclBaseEvent {
     constructor(item: EclCarouselItem);
 }
 
-/**
- * Single slide item for use inside an `EclCarouselComponent`.
- * Renders a `role="tabpanel"` element with an `aria-roledescription="slide"` and handles
- * the `inert` attribute so only the active slide is interactive.
- *
- * - Selector: `ecl-carousel-item`.
- * - `id` — optional unique identifier; used by the carousel for navigation buttons.
- * - `isCurrent` (input alias) — initial active state; kept as a `linkedSignal` so the parent
- *   carousel can update it imperatively as the user navigates.
- * - `slideClick` — emits `EclSlideEvent` when the slide is clicked.
- * - `index` / `ariaLabel` — writable signals assigned by the parent carousel.
- * - Project an optional `EclBannerComponent` inside the slide for banner-style slides.
- */
-declare class EclCarouselItemComponent extends ECLBaseDirective implements EclCarouselItem {
-    el: ElementRef<any>;
-    /**
-     * The aria-label for the slide, assigned dynamically by the carousel.
-     */
-    readonly ariaLabel: _angular_core.WritableSignal<string>;
-    /**
-     * The unique identifier of the slide.
-     */
-    readonly id: _angular_core.InputSignal<string>;
-    /**
-     * Input controlling whether this slide starts as the active/visible one.
-     * Automatically coerced to a boolean value.
-     */
-    readonly isCurrentInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
-    /**
-     * Indicates whether this slide is currently active/visible.
-     * Seeded from the `isCurrent` input but can be updated imperatively by the
-     * parent carousel as the user navigates between slides.
-     */
-    readonly isCurrent: _angular_core.WritableSignal<boolean>;
-    /**
-     * Emits an event when the slide is clicked.
-     */
-    readonly slideClick: _angular_core.OutputEmitterRef<EclSlideEvent>;
-    /**
-     * Optionally captures a banner component projected into the slide.
-     */
-    readonly banner: _angular_core.Signal<any>;
-    /**
-     * Internal slide index, assigned dynamically by the carousel.
-     */
-    readonly index: _angular_core.WritableSignal<number>;
-    /**
-     * Computes the slide's CSS class.
-     */
-    protected readonly cssClasses: _angular_core.Signal<string>;
-    /**
-     * Handles click events on the slide and emits a slideClick event.
-     */
-    onSlideClick(): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EclCarouselItemComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EclCarouselItemComponent, "ecl-carousel-item", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "isCurrentInput": { "alias": "isCurrent"; "required": false; "isSignal": true; }; }, { "slideClick": "slideClick"; }, ["banner"], ["*"], true, never>;
-}
-
 /**
  * Carousel (slideshow) component following the ECL design system.
  * Renders a sequence of `EclCarouselItemComponent` slides with autoplay, keyboard navigation,
  * responsive breakpoint awareness, and RTL layout support.
  *
+ * The slide engine is powered by Embla (via `embla-carousel-angular`), matching the upstream
+ * ECL implementation: an infinite `loop`, the `Autoplay` plugin driving the teaser loading bars,
+ * and a slider pager with previous/next/play/pause controls, a counter, and a tablist of teaser
+ * buttons (one per slide).
+ *
  * - Selector: `ecl-carousel`.
  * - Project `ecl-carousel-item` elements as slides (also via `contentChildren`).
- * - `ariaLabel` — ARIA label for the carousel landmark; aliased as `aria-label`; default `'Carousel description here'`.
+ * - `ariaLabel` — ARIA label for the carousel landmark; aliased as `aria-label`.
  * - `isAutoplay` — enables automatic slide advancement; boolean attribute.
  * - `playInterval` — milliseconds between automatic transitions; default `5000`.
+ * - `counterLabel` — separator label used by the counter, defaults to `ecl.common.OF`.
  * - `slide` — emits `EclSlideEvent` when the active slide changes.
- * - `isPlaying` / `isPausedForced` — public flags reflecting playback state.
- * - `isRtl` — public flag reflecting RTL mode.
- * - Navigation controls and play/pause buttons are rendered internally.
  */
 declare class EclCarouselComponent extends ECLBaseDirective implements OnInit, OnDestroy, AfterContentInit {
     /**
@@ -114,12 +60,17 @@ declare class EclCarouselComponent extends ECLBaseDirective implements OnInit, O
      * Interval in milliseconds between automatic slide transitions.
      */
     readonly playInterval: _angular_core.InputSignalWithTransform<number, unknown>;
+    /**
+     * Separator label used by the counter, e.g. the "of" in "1 of 5".
+     * Defaults to the translated `ecl.common.OF` key.
+     */
+    readonly counterLabel: _angular_core.InputSignal<string>;
     /**
      * Event emitted when a slide change occurs.
      */
     readonly slide: _angular_core.OutputEmitterRef<EclSlideEvent>;
     /**
-     * Reference to the main carousel container element.
+     * Reference to the main carousel viewport element (the Embla root).
      */
     readonly carouselContainerElement: _angular_core.Signal<ElementRef<any>>;
     /**
@@ -127,71 +78,98 @@ declare class EclCarouselComponent extends ECLBaseDirective implements OnInit, O
      */
     readonly slides: _angular_core.Signal<readonly any[]>;
     /**
-     * References to the navigation buttons corresponding to each slide.
+     * Indicates whether autoplay is currently active.
+     */
+    readonly isPlaying: _angular_core.WritableSignal<boolean>;
+    /**
+     * Indicates whether autoplay was manually paused (via the pause button or
+     * on mobile). When paused this way the loading bar is cleared.
      */
-    readonly navigationButtons: _angular_core.Signal<readonly ElementRef<any>[]>;
+    readonly isPausedForced: _angular_core.WritableSignal<boolean>;
     /**
-     * Reference to the play button element.
+     * Indicates whether the layout is currently in RTL mode.
      */
-    readonly playButton: _angular_core.Signal<ElementRef<any>>;
+    isRtl: boolean;
     /**
-     * Reference to the pause button element.
+     * Zero-based index of the currently active slide (mirrors Embla's selected snap).
      */
-    readonly pauseButton: _angular_core.Signal<ElementRef<any>>;
+    private activeIndex;
     /**
-     * Reference to the first hidden slide item (used for focus management).
+     * Start index of the currently visible teaser window (desktop only).
      */
-    readonly firstHiddenItem: _angular_core.Signal<EclCarouselItemComponent>;
+    private teaserWindowStart;
     /**
-     * Reference to the last hidden slide item (used for focus management).
+     * Indicates whether autoplay is temporarily paused by hover/focus. Unlike a
+     * manual pause, the loading bar stays visible and frozen at its current
+     * progress (matching ECL), resuming when the pointer/focus leaves.
      */
-    readonly lastHiddenItem: _angular_core.Signal<EclCarouselItemComponent>;
+    protected readonly isHoverPaused: _angular_core.WritableSignal<boolean>;
     /**
-     * Reference to the slides container element.
+     * Whether the current viewport is at the mobile breakpoint. A signal so the
+     * template can react (the pager drops play/pause on mobile, matching ECL,
+     * where play/pause is a desktop-only control).
      */
-    readonly slidesContainer: _angular_core.Signal<ElementRef<any>>;
+    protected readonly isMobileBreakpoint: _angular_core.WritableSignal<boolean>;
     /**
-     * Indicates whether autoplay is currently active.
+     * Whether the viewport is at or above the ECL desktop breakpoint (1140px).
+     * This is the boundary the ECL CSS uses to show the play/pause controls and
+     * the teaser tablist (and to hide the mobile dots). A signal so the pager
+     * variant can react: play/pause only renders at/above this width, matching
+     * the CSS so the pause button never leaks onto narrower viewports.
      */
-    isPlaying: boolean;
+    protected readonly isDesktopBreakpointActive: _angular_core.WritableSignal<boolean>;
     /**
-     * Indicates whether autoplay was manually paused.
+     * Embla options, mirroring the upstream ECL configuration.
      */
-    isPausedForced: boolean;
+    protected emblaOptions: EmblaOptionsType;
     /**
-     * Indicates whether the layout is currently in RTL mode.
+     * Embla plugins. Built once so the Embla directive does not needlessly re-init.
      */
-    isRtl: boolean;
+    protected emblaPlugins: EmblaPluginType[];
+    /**
+     * Embla events the component reacts to.
+     */
+    protected readonly emblaEvents: EmblaEventType[];
+    /**
+     * Reference to the Embla directive driving the slide engine.
+     */
+    private readonly embla;
+    /**
+     * References to the teaser navigation buttons corresponding to each slide.
+     */
+    private readonly teaserButtons;
     /**
-     * Duration of the slide transition animation (in seconds).
+     * References to the teaser loading-bar completion elements (one per slide),
+     * used to restart the progress animation when the active slide changes.
      */
-    transitionDuration: number;
-    private isMobileBreakpoint;
-    private isSmallTabletBreakpoint;
+    private readonly loadingBars;
     private isTabletBreakpoint;
-    private isDesktopBreakpoint;
     private isLargeBreakpoint;
-    private playSubject;
-    private stopSubject;
+    private isDesktopBreakpoint;
     private destroy$;
-    private unsubscribeListener;
     /**
      * Debounce interval (ms) used internally for timing and transitions.
      */
     private readonly TIMEOUT_INTERVAL;
-    private cdkBreakpointObserver;
-    private cd;
-    private renderer2;
-    private eclRtlService;
+    private readonly cdkBreakpointObserver;
+    private readonly cd;
+    private readonly renderer2;
+    private readonly eclRtlService;
+    private readonly translate;
     private readonly document;
     private readonly window;
-    constructor();
+    /**
+     * Host element, used to locate the slider pager's play/pause buttons by their
+     * ECL classes for focus management after a play/pause toggle.
+     */
+    private readonly hostEl;
     /**
      * Returns the computed CSS class list for the component.
      */
     protected readonly cssClasses: _angular_core.Signal<string>;
+    constructor();
     /**
-     * Angular lifecycle hook: initializes autoplay and RTL detection.
+     * Angular lifecycle hook: initializes RTL detection and the Embla plugins.
      */
     ngOnInit(): void;
     /**
@@ -199,208 +177,262 @@ declare class EclCarouselComponent extends ECLBaseDirective implements OnInit, O
      */
     ngAfterContentInit(): void;
     /**
-     * Angular lifecycle hook: cleans up subscriptions and event listeners.
+     * Angular lifecycle hook: cleans up subscriptions.
      */
     ngOnDestroy(): void;
     /**
-     * Starts autoplay and focuses the pause button.
-     */
-    onPlayClick(): void;
-    /**
-     * Stops autoplay and focuses the play button.
-     */
-    onPauseClick(): void;
-    /**
-     * Handles key press on the first carousel element to stop autoplay if TAB is pressed.
+     * Returns whether the carousel has padding applied (e.g., on desktop breakpoint).
      */
-    onFirstCarouselElementPress(e: any): void;
+    isPadded(): boolean;
     /**
-     * Handles keyboard interaction on the play button.
+     * Checks whether there are enough slides to render controls.
      */
-    onPlayKeyboardPress(e: any): void;
+    hasControls(): boolean;
     /**
-     * Handles keyboard navigation for the navigation buttons.
+     * Retrieves the current active slide index (zero-based).
      */
-    onNavBtnKeyboardPress(e: KeyboardEvent, index: number): void;
+    getCurrentSlideIndex(): number;
     /**
-     * Checks whether a given button is currently visible (not hidden via style).
+     * Returns the 1-based position of the active slide (for the counter).
      */
-    isButtonVisible(button: ElementRef): boolean;
+    getCounterCurrent(): number;
     /**
-     * Sets focus on the specified button.
+     * Returns the total number of slides (for the counter).
      */
-    focusOnButton(button: ElementRef): void;
+    getCounterTotal(): number;
     /**
-     * Handles user interaction with a slide control button.
+     * Dot indices for the mobile slider pager (one dot per slide). The dots are
+     * hidden on desktop via the ECL CSS (`.ecl-carousel__dots { display: none }`)
+     * and shown at the mobile breakpoint.
      */
-    onSlideControlClick(slide: EclCarouselItemComponent): void;
+    getDotIndices(): number[];
     /**
-     * Navigates to the next slide and stops autoplay.
+     * Pre-translated accessible label for each pager dot. Translated here since
+     * the shared `ecl-slider-pager` receives plain strings.
      */
-    onNextSlideClick(): void;
+    getDotAriaLabels(): string[];
     /**
-     * Navigates to the previous slide and stops autoplay.
+     * Returns whether a teaser button should be visible in the current window.
      */
-    onPreviousSlideClick(): void;
+    isTeaserVisible(index: number): boolean;
     /**
-     * Pauses autoplay on mouse hover.
+     * Returns the flex order of a teaser button within the visible window.
      */
-    onSlideHover(): void;
+    getTeaserOrder(index: number): number;
     /**
-     * Resumes autoplay on mouse leave, if not manually paused.
+     * Whether the pager should show the "pause" control (i.e. autoplay is
+     * actively running). While the pointer/focus hover-pauses the carousel the
+     * timer is suspended, so the pager must show "play" even though a manual
+     * pause was not triggered. Mirrors upstream ECL, where hovering flips the
+     * control to play.
      */
-    onSlideHoverout(): void;
+    protected isPagerPlaying(): boolean;
     /**
-     * Returns whether the stop button (pause) has been pressed by the user.
+     * Pager variant by breakpoint. Below the ECL desktop breakpoint (1140px)
+     * the carousel shows only the dots navigation (prev / dots / next);
+     * play/pause is a desktop-only control in ECL. Rendering `'dots'` there
+     * avoids the pager's inline play/pause `display` style (which would
+     * otherwise beat the ECL CSS and leave the pause button visible on narrower
+     * viewports). At/above 1140px the dots are hidden by CSS, so
+     * `'play-pause-dots'` yields play/pause + prev/next + teasers.
+     *
+     * The 1140px boundary mirrors the media query the ECL CSS uses to toggle
+     * `.ecl-carousel__play/__pause` and `.ecl-carousel__teasers`.
      */
-    isStopButtonPressed(): boolean;
+    protected pagerVariant(): 'dots' | 'play-pause-dots';
     /**
-     * Returns whether the carousel has padding applied (e.g., on desktop breakpoint).
+     * Handles the throttled Embla events the component subscribed to.
      */
-    isPadded(): boolean;
+    protected onEmblaEvent(event: EmblaEventType): void;
     /**
-     * Checks whether there are enough slides to render controls.
+     * Starts autoplay.
+     *
+     * @param moveFocus when true (a user clicked play) focus moves to the pause
+     *        button. Auto-starts (e.g. on breakpoint changes) pass false so the
+     *        page is not scrolled to the carousel on load.
      */
-    hasControls(): boolean;
+    protected onPlayClick(moveFocus?: boolean): void;
     /**
-     * Retrieves the current active slide index.
-     * Corrects index for internal structure with hidden buffer slides.
+     * Stops autoplay and focuses the play button.
      */
-    getCurrentSlideIndex(): number;
+    protected onPauseClick(): void;
     /**
-     * Computes the left offset to shift the slides container.
+     * Navigates to the next slide and stops autoplay.
      */
-    getCarouselSlidesOffsetLeft(): number;
+    protected onNextSlideClick(): void;
     /**
-     * Computes the right offset to shift the slides container (same logic as left in RTL).
+     * Navigates to the previous slide and stops autoplay.
      */
-    getCarouselSlidesOffsetRight(): number;
+    protected onPreviousSlideClick(): void;
     /**
-     * Subscribes to RTL layout state changes to adapt carousel behavior.
+     * Handles user interaction with a teaser button: activates the matching slide.
      */
-    private handleRtlChangeState;
+    protected onTeaserClick(index: number): void;
     /**
-     * Initializes autoplay logic using RxJS intervals and subject triggers.
+     * Handles a dot activation from the mobile slider pager: scrolls to the
+     * matching slide and stops autoplay (same behavior as a teaser click).
      */
-    private initAutoplay;
+    protected onDotClick(index: number): void;
     /**
-     * Returns the index of the currently active slide item.
+     * Handles keyboard navigation (ArrowLeft/ArrowRight) across teaser buttons.
      */
-    private getCurrentItemIndex;
+    protected onTeaserKeyboardPress(event: KeyboardEvent, index: number): void;
     /**
-     * Initializes slides, hidden buffer items, and sets default active slide.
+     * Freezes the loading bar while the pointer/focus is over the carousel.
+     * The Embla autoplay plugin pauses the timer itself (stopOnMouseEnter /
+     * stopOnFocusIn); this only mirrors that as a visible paused state.
      */
-    private initializeSlider;
+    protected onViewportPause(): void;
     /**
-     * Initializes hidden first and last slide clones used for infinite scroll illusion.
+     * Resumes the loading bar once the pointer/focus leaves the carousel.
      */
-    private initHiddenItems;
+    protected onViewportResume(): void;
     /**
-     * Verifies current index and resets to actual slide if hidden clone is reached.
+     * Sets focus on the specified button.
      */
-    private checkIndex;
+    private focusOnButton;
     /**
-     * Returns the inner HTML of the last real slide (used for buffer item).
+     * Focuses the slider pager button matching the given ECL class selector
+     * (e.g. `.ecl-carousel__play`). Used after a play/pause toggle so focus
+     * follows the now-visible control, since the pager swaps play/pause
+     * visibility via CSS. No-op if the button is not rendered (e.g. mobile).
      */
-    private getLastContentChild;
+    private focusPagerButton;
     /**
-     * Returns the inner HTML of the first real slide (used for buffer item).
+     * Returns the Embla autoplay plugin instance, but only when the carousel
+     * actually has more than one scroll snap.
+     *
+     * The `embla-carousel-autoplay` plugin skips its own initialization when
+     * `scrollSnapList().length <= 1` (see the plugin's `init`), which leaves its
+     * internal `delay` lookup table undefined. Calling `play()` in that state
+     * throws (`delay[selectedScrollSnap()]` -> reading `0` of undefined). This
+     * happens whenever Embla cannot lay out multiple snaps — notably in a jsdom
+     * test or during SSR. Gating on the same `> 1` condition the plugin uses
+     * keeps autoplay a safe no-op until the carousel is genuinely slideable.
      */
-    private getFirstContentChild;
+    private getAutoplay;
     /**
-     * Sets up a slide with index and ARIA label.
+     * Whether autoplay should run. On by default (matching ECL); only disabled
+     * when the consumer explicitly sets `[isAutoplay]="false"`.
      */
-    private initSlide;
+    private isAutoplayDesired;
     /**
-     * Activates the next slide, with option to loop.
+     * Stops autoplay and resets it (mirrors ECL's `handleAutoPlay(true)`),
+     * clearing the loading-bar state.
      */
-    private goToNextSlide;
+    private stopAutoplay;
     /**
-     * Activates the previous slide, with option to loop.
+     * Synchronizes component state from Embla's current selected snap:
+     * active index, slide `isCurrent` flags, teaser window and the slide event.
      */
-    private goToPreviousSlide;
+    private syncFromEmbla;
     /**
-     * Activates a specific slide and triggers slide change event if needed.
+     * Subscribes to RTL layout state changes to adapt carousel direction.
      */
-    private activateSlide;
+    private handleRtlChangeState;
     /**
-     * Checks if the currently focused button is the last in the list.
+     * Initializes slides (index, ARIA label, banner height management).
      */
-    private isLastButton;
+    private initSlides;
     /**
-     * Checks if the currently focused button is the first in the list.
+     * Updates the active index and synchronizes slide active/inert state.
      */
-    private isFirstButton;
+    private setActiveIndex;
     /**
-     * Starts autoplay mode and updates state.
+     * Restarts the CSS progress animation on the active slide's loading bar.
+     * The animation uses `forwards`, so re-applying the `is-active` class alone
+     * will not replay it; the animation must be reset explicitly.
      */
-    private startPlaying;
+    private restartActiveLoadingBar;
     /**
-     * Stops autoplay mode and updates state.
+     * Advances the visible teaser window when the active slide moves out of it.
      */
-    private stopPlaying;
+    private updateTeaserWindow;
     /**
-     * Temporarily pauses autoplay (e.g. on mouse hover).
+     * Returns the number of actual visible slides.
      */
-    private pausePlaying;
+    private getSlidesCount;
     /**
-     * Resumes autoplay after being paused.
+     * Observes screen breakpoint changes to adjust autoplay and layout behavior.
      */
-    private resumePlaying;
+    private observeBreakpointChanges;
     /**
-     * Retrieves the next slide based on the current index and loop setting.
+     * Observes changes to the carousel's viewport element size using a timeout debounce.
      */
-    private getNextSlide;
+    private observeElementSizeChanges;
     /**
-     * Returns all slides, including the hidden buffer items.
+     * Normalizes the height of all banners to match the tallest banner.
      */
-    private getAllSlidesArray;
+    private checkBannerHeights;
     /**
-     * Retrieves the previous slide based on the current index and loop setting.
+     * Clears all explicit banner height and aspect ratio styling for smaller breakpoints.
      */
-    private getPreviousSlide;
+    private resetHeight;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EclCarouselComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EclCarouselComponent, "ecl-carousel", never, { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "isAutoplay": { "alias": "isAutoplay"; "required": false; "isSignal": true; }; "playInterval": { "alias": "playInterval"; "required": false; "isSignal": true; }; "counterLabel": { "alias": "counterLabel"; "required": false; "isSignal": true; }; }, { "slide": "slide"; }, ["slides"], ["*"], true, never>;
+}
+
+/**
+ * Single slide item for use inside an `EclCarouselComponent`.
+ * Renders a `role="tabpanel"` element with an `aria-roledescription="slide"` and handles
+ * the `inert` attribute so only the active slide is interactive.
+ *
+ * - Selector: `ecl-carousel-item`.
+ * - `id` — optional unique identifier; used by the carousel for navigation buttons.
+ * - `isCurrent` (input alias) — initial active state; kept as a `linkedSignal` so the parent
+ *   carousel can update it imperatively as the user navigates.
+ * - `slideClick` — emits `EclSlideEvent` when the slide is clicked.
+ * - `index` / `ariaLabel` — writable signals assigned by the parent carousel.
+ * - Project an optional `EclBannerComponent` inside the slide for banner-style slides.
+ */
+declare class EclCarouselItemComponent extends ECLBaseDirective implements EclCarouselItem {
+    el: ElementRef<any>;
     /**
-     * Returns the number of actual visible slides (excluding hidden buffer).
+     * The aria-label for the slide, assigned dynamically by the carousel.
      */
-    private getSlidesCount;
+    readonly ariaLabel: _angular_core.WritableSignal<string>;
     /**
-     * Returns total number of slides, including buffer (hidden) items.
+     * The unique identifier of the slide.
      */
-    private getAllSlidesCount;
+    readonly id: _angular_core.InputSignal<string>;
     /**
-     * Determines whether no slide is currently marked as active.
+     * Input controlling whether this slide starts as the active/visible one.
+     * Automatically coerced to a boolean value.
      */
-    private isNoSlideSelected;
+    readonly isCurrentInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
-     * Handles right arrow key navigation for buttons.
+     * Indicates whether this slide is currently active/visible.
+     * Seeded from the `isCurrent` input but can be updated imperatively by the
+     * parent carousel as the user navigates between slides.
      */
-    private onNavigationButtonArrowRight;
+    readonly isCurrent: _angular_core.WritableSignal<boolean>;
     /**
-     * Handles left arrow key navigation for buttons.
+     * Text shown in the carousel teaser (navigation) button for this slide.
+     * Optional; when empty, no teaser label is rendered for the slide.
      */
-    private onNavigationButtonArrowLeft;
+    readonly teaserText: _angular_core.InputSignal<string>;
     /**
-     * Observes screen breakpoint changes to adjust autoplay and layout behavior.
+     * Emits an event when the slide is clicked.
      */
-    private observeBreakpointChanges;
+    readonly slideClick: _angular_core.OutputEmitterRef<EclSlideEvent>;
     /**
-     * Observes changes to the carousel's container element size using ResizeObserver.
+     * Optionally captures a banner component projected into the slide.
      */
-    private observeElementSizeChanges;
+    readonly banner: _angular_core.Signal<any>;
     /**
-     * Normalizes the height of all banners to match the tallest banner.
+     * Internal slide index, assigned dynamically by the carousel.
      */
-    private checkBannerHeights;
+    readonly index: _angular_core.WritableSignal<number>;
     /**
-     * Clears all explicit banner height and aspect ratio styling for smaller breakpoints.
+     * Computes the slide's CSS class.
      */
-    private resetHeight;
+    protected readonly cssClasses: _angular_core.Signal<string>;
     /**
-     * Re-renders the content of hidden buffer items after style reset.
+     * Handles click events on the slide and emits a slideClick event.
      */
-    private resetHiddenItems;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EclCarouselComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EclCarouselComponent, "ecl-carousel", never, { "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; "isAutoplay": { "alias": "isAutoplay"; "required": false; "isSignal": true; }; "playInterval": { "alias": "playInterval"; "required": false; "isSignal": true; }; }, { "slide": "slide"; }, ["slides"], ["*"], true, never>;
+    onSlideClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EclCarouselItemComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EclCarouselItemComponent, "ecl-carousel-item", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "isCurrentInput": { "alias": "isCurrent"; "required": false; "isSignal": true; }; "teaserText": { "alias": "teaserText"; "required": false; "isSignal": true; }; }, { "slideClick": "slideClick"; }, ["banner"], ["*"], true, never>;
 }
 
 declare const EUI_ECL_CAROUSEL: readonly [typeof EclCarouselComponent, typeof EclCarouselItemComponent];

package/types/eui-ecl-components-ecl-carousel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"eui-ecl-components-ecl-carousel.d.ts","sources":["../../components/ecl-carousel/models/ecl-carousel-item.model.ts","../../components/ecl-carousel/events/ecl-slide.event.ts","../../components/ecl-carousel/ecl-carousel-item.component.ts","../../components/ecl-carousel/ecl-carousel.component.ts","../../components/ecl-carousel/index.ts"],"mappings":"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","names":[]}
+{"version":3,"file":"eui-ecl-components-ecl-carousel.d.ts","sources":["../../components/ecl-carousel/models/ecl-carousel-item.model.ts","../../components/ecl-carousel/events/ecl-slide.event.ts","../../components/ecl-carousel/ecl-carousel.component.ts","../../components/ecl-carousel/ecl-carousel-item.component.ts","../../components/ecl-carousel/index.ts"],"mappings":"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","names":[]}