@ascentgl/ads-ui 22.13.0 → 22.14.1

package/fesm2022/ascentgl-ads-ui.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Input, ChangeDetectionStrategy, Component, input, output, computed, effect, inject, model, signal, viewChild, HostListener, ElementRef, ViewChild, Directive, EventEmitter, Output, InjectionToken, DestroyRef, HostBinding, Pipe, contentChild, TemplateRef, Inject, Optional, Injectable, ChangeDetectorRef, Renderer2, viewChildren, booleanAttribute, ViewChildren } from '@angular/core';
+import { Input, ChangeDetectionStrategy, Component, input, output, computed, effect, inject, model, signal, viewChild, HostListener, ElementRef, ViewChild, Directive, EventEmitter, Output, InjectionToken, DestroyRef, HostBinding, Pipe, contentChild, TemplateRef, Inject, Optional, Injectable, ChangeDetectorRef, Renderer2, viewChildren, booleanAttribute, ViewChildren, ContentChildren } from '@angular/core';
 import * as i1$1 from '@angular/common';
 import { CommonModule, NgTemplateOutlet, NgStyle, DOCUMENT, NgClass } from '@angular/common';
 import * as i1 from '@ascentgl/ads-icons';
@@ -5752,8 +5752,6 @@ class AdsDatepickerComponent extends AdsDatetimepickerComponent {
         this.inputModifiedByKeyHandler = false;
         /** @ignore */
         this.elementRef = inject(ElementRef);
-        /** @ignore */
-        this.overlayContainerRef = inject(OverlayContainer);
     }
     /** @ignore */
     ngOnInit() {
@@ -5791,6 +5789,13 @@ class AdsDatepickerComponent extends AdsDatetimepickerComponent {
      * Disabling pointer events on the backdrop lets the browser handle scrolling
      * natively (preserving momentum / inertia). A document-level pointerdown
      * listener replaces the lost backdrop click-to-close behaviour.
+     *
+     * Everything here is scoped to *this* picker's own overlay via {@link getPopupRef}. Reading the
+     * shared `OverlayContainer` instead returns whichever overlay was created first, so a picker used
+     * inside a dialog silently operated on the dialog's backdrop and pane: the dialog lost its
+     * click-outside behavior, and — because a calendar cell is not inside the dialog's pane — the
+     * pointerdown listener treated every click on the calendar as "outside" and closed the picker
+     * before it could select a date.
      */
     onOpened() {
         super.onOpened();
@@ -5806,8 +5811,7 @@ class AdsDatepickerComponent extends AdsDatetimepickerComponent {
     setupScrollPassthrough() {
         this.scrollPassthroughCleanup?.();
         this.scrollPassthroughCleanup = undefined;
-        const container = this.overlayContainerRef.getContainerElement();
-        const backdrop = container.querySelector('.cdk-overlay-backdrop');
+        const backdrop = this.getPopupRef()?.backdropElement ?? null;
         // Disable pointer events on the backdrop so that wheel / touch events
         // reach the scroll container natively. This preserves momentum scrolling
         // and avoids the scroll-stop when closeOnOutOfView closes the picker mid-scroll.
@@ -5823,7 +5827,8 @@ class AdsDatepickerComponent extends AdsDatetimepickerComponent {
             const onPointerDown = (event) => {
                 if (!this.picker?.opened)
                     return;
-                const overlayPane = container.querySelector('.cdk-overlay-pane');
+                // Re-read each time: the picker may have been reopened on a fresh overlay.
+                const overlayPane = this.getPopupRef()?.overlayElement;
                 const clickedInside = overlayPane?.contains(event.target) ||
                     this.elementRef.nativeElement.contains(event.target);
                 if (!clickedInside) {
@@ -5843,14 +5848,23 @@ class AdsDatepickerComponent extends AdsDatetimepickerComponent {
         const scrollTarget = this.findScrollableAncestor(this.elementRef.nativeElement);
         if (scrollTarget) {
             const onScroll = () => {
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                this.picker?._popupRef?.updatePosition();
+                this.getPopupRef()?.updatePosition();
             };
             scrollTarget.addEventListener('scroll', onScroll, { passive: true });
             cleanupFns.push(() => scrollTarget.removeEventListener('scroll', onScroll));
         }
         this.scrollPassthroughCleanup = () => cleanupFns.forEach((fn) => fn());
     }
+    /**
+     * @ignore - This picker's own calendar overlay, or undefined while it is closed.
+     * `_popupRef` is private in `MatDatetimepickerComponent`, hence the cast; it is the only handle on
+     * the overlay this picker created, and the only safe one — the `OverlayContainer` is shared by
+     * every overlay on the page.
+     */
+    getPopupRef() {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        return this.picker?._popupRef;
+    }
     /** @ignore - Walk up the DOM to find the first ancestor with overflow-y: auto|scroll */
     findScrollableAncestor(node) {
         let current = node.parentElement;
@@ -6524,11 +6538,11 @@ class AdsSnackbarComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: AdsSnackbarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: AdsSnackbarComponent, isStandalone: true, selector: "ads-snackbar", host: { listeners: { "click": "onSnackbarClick()" } }, ngImport: i0, template: "<div class=\"container\" (click)=\"onSnackbarClick()\" [id]=\"id\">\n  <div class=\"snackbar-container\">\n    @if (icon; as iconConfig) {\n      <ads-icon\n        class=\"snackbar-icon\"\n        [class.rotated]=\"iconConfig.rotated\"\n        [name]=\"iconConfig.name\"\n        [color]=\"iconConfig.color\"\n        [stroke]=\"iconConfig.stroke\"\n        size=\"sm\"\n      />\n    }\n    <span class=\"snackbar-text\" [innerHTML]=\"data.message\" [id]=\"id + '-details'\"></span>\n  </div>\n  @if (!data.hideActionButton) {\n    <ads-button\n      [id]=\"id + '-button'\"\n      [variant]=\"buttonPanelClass\"\n      (click)=\"data.onButtonClick ? data.onButtonClick() : snackBarRef.dismissWithAction(); $event.stopPropagation()\"\n    >\n      {{ data.buttonCaption ?? defaultButtonCaption }}\n    </ads-button>\n  }\n  @if (showProgressBar) {\n    <div class=\"snackbar-progress\" [style.animation-duration.ms]=\"autoCloseDuration\"></div>\n  }\n</div>\n", styles: [".container{display:flex;justify-content:space-between;align-items:center;gap:24px;width:80vw}.container .snackbar-container{display:flex;align-items:center;gap:16px}.container .snackbar-container .snackbar-icon{flex-shrink:0;display:inline-flex;align-items:center}.container .snackbar-container .snackbar-icon.rotated{transform:rotate(180deg)}.container .snackbar-container .snackbar-text{color:var(--color-white);font-size:16px;font-weight:400;line-height:21px}ads-button{white-space:nowrap}.snackbar-progress{position:absolute;left:0;bottom:0;width:100%;height:8px;background-color:#ced6e880;border-bottom-left-radius:var(--mdc-snackbar-container-shape, 4px);border-bottom-right-radius:var(--mdc-snackbar-container-shape, 4px);animation-name:ads-snackbar-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@keyframes ads-snackbar-countdown{0%{width:100%}to{width:0}}@media(width<=500px){.container{width:100%}}\n"], dependencies: [{ kind: "component", type: AdsButtonComponent, selector: "ads-button", inputs: ["id", "variant", "disabled", "size", "type", "fullWidth"] }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: AdsSnackbarComponent, isStandalone: true, selector: "ads-snackbar", host: { listeners: { "click": "onSnackbarClick()" } }, ngImport: i0, template: "<div class=\"container\" (click)=\"onSnackbarClick()\" [id]=\"id\">\n  <div class=\"snackbar-container\">\n    @if (icon; as iconConfig) {\n      <ads-icon\n        class=\"snackbar-icon\"\n        [class.rotated]=\"iconConfig.rotated\"\n        [name]=\"iconConfig.name\"\n        [color]=\"iconConfig.color\"\n        [stroke]=\"iconConfig.stroke\"\n        size=\"sm\"\n      />\n    }\n    <span class=\"snackbar-text\" [innerHTML]=\"data.message\" [id]=\"id + '-details'\"></span>\n  </div>\n  @if (!data.hideActionButton) {\n    <ads-button\n      [id]=\"id + '-button'\"\n      [variant]=\"buttonPanelClass\"\n      (click)=\"data.onButtonClick ? data.onButtonClick() : snackBarRef.dismissWithAction(); $event.stopPropagation()\"\n    >\n      {{ data.buttonCaption ?? defaultButtonCaption }}\n    </ads-button>\n  }\n  @if (showProgressBar) {\n    <div class=\"snackbar-progress\" [style.animation-duration.ms]=\"autoCloseDuration\"></div>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";.container{display:flex;justify-content:space-between;align-items:center;gap:24px;width:80vw}.container .snackbar-container{display:flex;align-items:center;gap:16px}.container .snackbar-container .snackbar-icon{flex-shrink:0;display:inline-flex;align-items:center}.container .snackbar-container .snackbar-icon.rotated{transform:rotate(180deg)}.container .snackbar-container .snackbar-text{color:var(--color-white);font-size:16px;font-weight:400;line-height:21px}ads-button{white-space:nowrap}::ng-deep .mdc-snackbar.mat-mdc-snack-bar-container.warning{--mat-snack-bar-container-color: var(--color-alert, #ff5e00)}::ng-deep .mdc-snackbar.mat-mdc-snack-bar-container.warning>.button{color:var(--color-error, #bb1e1e)}.snackbar-progress{position:absolute;left:0;bottom:0;width:100%;height:8px;background-color:#ced6e880;border-bottom-left-radius:var(--mdc-snackbar-container-shape, 4px);border-bottom-right-radius:var(--mdc-snackbar-container-shape, 4px);animation-name:ads-snackbar-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@keyframes ads-snackbar-countdown{0%{width:100%}to{width:0}}@media(width<=500px){.container{width:100%}}\n"], dependencies: [{ kind: "component", type: AdsButtonComponent, selector: "ads-button", inputs: ["id", "variant", "disabled", "size", "type", "fullWidth"] }, { kind: "ngmodule", type: MatSnackBarModule }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: AdsSnackbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ads-snackbar', imports: [AdsButtonComponent, MatSnackBarModule, CommonModule, AdsIconComponent], template: "<div class=\"container\" (click)=\"onSnackbarClick()\" [id]=\"id\">\n  <div class=\"snackbar-container\">\n    @if (icon; as iconConfig) {\n      <ads-icon\n        class=\"snackbar-icon\"\n        [class.rotated]=\"iconConfig.rotated\"\n        [name]=\"iconConfig.name\"\n        [color]=\"iconConfig.color\"\n        [stroke]=\"iconConfig.stroke\"\n        size=\"sm\"\n      />\n    }\n    <span class=\"snackbar-text\" [innerHTML]=\"data.message\" [id]=\"id + '-details'\"></span>\n  </div>\n  @if (!data.hideActionButton) {\n    <ads-button\n      [id]=\"id + '-button'\"\n      [variant]=\"buttonPanelClass\"\n      (click)=\"data.onButtonClick ? data.onButtonClick() : snackBarRef.dismissWithAction(); $event.stopPropagation()\"\n    >\n      {{ data.buttonCaption ?? defaultButtonCaption }}\n    </ads-button>\n  }\n  @if (showProgressBar) {\n    <div class=\"snackbar-progress\" [style.animation-duration.ms]=\"autoCloseDuration\"></div>\n  }\n</div>\n", styles: [".container{display:flex;justify-content:space-between;align-items:center;gap:24px;width:80vw}.container .snackbar-container{display:flex;align-items:center;gap:16px}.container .snackbar-container .snackbar-icon{flex-shrink:0;display:inline-flex;align-items:center}.container .snackbar-container .snackbar-icon.rotated{transform:rotate(180deg)}.container .snackbar-container .snackbar-text{color:var(--color-white);font-size:16px;font-weight:400;line-height:21px}ads-button{white-space:nowrap}.snackbar-progress{position:absolute;left:0;bottom:0;width:100%;height:8px;background-color:#ced6e880;border-bottom-left-radius:var(--mdc-snackbar-container-shape, 4px);border-bottom-right-radius:var(--mdc-snackbar-container-shape, 4px);animation-name:ads-snackbar-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@keyframes ads-snackbar-countdown{0%{width:100%}to{width:0}}@media(width<=500px){.container{width:100%}}\n"] }]
+            args: [{ selector: 'ads-snackbar', imports: [AdsButtonComponent, MatSnackBarModule, CommonModule, AdsIconComponent], template: "<div class=\"container\" (click)=\"onSnackbarClick()\" [id]=\"id\">\n  <div class=\"snackbar-container\">\n    @if (icon; as iconConfig) {\n      <ads-icon\n        class=\"snackbar-icon\"\n        [class.rotated]=\"iconConfig.rotated\"\n        [name]=\"iconConfig.name\"\n        [color]=\"iconConfig.color\"\n        [stroke]=\"iconConfig.stroke\"\n        size=\"sm\"\n      />\n    }\n    <span class=\"snackbar-text\" [innerHTML]=\"data.message\" [id]=\"id + '-details'\"></span>\n  </div>\n  @if (!data.hideActionButton) {\n    <ads-button\n      [id]=\"id + '-button'\"\n      [variant]=\"buttonPanelClass\"\n      (click)=\"data.onButtonClick ? data.onButtonClick() : snackBarRef.dismissWithAction(); $event.stopPropagation()\"\n    >\n      {{ data.buttonCaption ?? defaultButtonCaption }}\n    </ads-button>\n  }\n  @if (showProgressBar) {\n    <div class=\"snackbar-progress\" [style.animation-duration.ms]=\"autoCloseDuration\"></div>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";.container{display:flex;justify-content:space-between;align-items:center;gap:24px;width:80vw}.container .snackbar-container{display:flex;align-items:center;gap:16px}.container .snackbar-container .snackbar-icon{flex-shrink:0;display:inline-flex;align-items:center}.container .snackbar-container .snackbar-icon.rotated{transform:rotate(180deg)}.container .snackbar-container .snackbar-text{color:var(--color-white);font-size:16px;font-weight:400;line-height:21px}ads-button{white-space:nowrap}::ng-deep .mdc-snackbar.mat-mdc-snack-bar-container.warning{--mat-snack-bar-container-color: var(--color-alert, #ff5e00)}::ng-deep .mdc-snackbar.mat-mdc-snack-bar-container.warning>.button{color:var(--color-error, #bb1e1e)}.snackbar-progress{position:absolute;left:0;bottom:0;width:100%;height:8px;background-color:#ced6e880;border-bottom-left-radius:var(--mdc-snackbar-container-shape, 4px);border-bottom-right-radius:var(--mdc-snackbar-container-shape, 4px);animation-name:ads-snackbar-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@keyframes ads-snackbar-countdown{0%{width:100%}to{width:0}}@media(width<=500px){.container{width:100%}}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { onSnackbarClick: [{
                 type: HostListener,
                 args: ['click']
@@ -11563,6 +11577,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
                 type: Output
             }] } });
 
+class AdsVerticalStepComponent {
+    constructor(registry) {
+        this.registry = registry;
+        /** Status of this step */
+        this.status = VerticalStepStatus.Planned;
+        /** @internal Set by the parent AdsVerticalStepperComponent */
+        this.isLast = false;
+        this.VerticalStepStatus = VerticalStepStatus;
+        this.registry.register([adsIconCheckCircleFilled, adsIconWarning]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: AdsVerticalStepComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: AdsVerticalStepComponent, isStandalone: true, selector: "ads-vertical-step", inputs: { status: "status" }, host: { attributes: { "role": "listitem" }, classAttribute: "stepper-item" }, ngImport: i0, template: "<div class=\"stepper-indicator-column\">\n  <div class=\"step-indicator\">\n    @if (status === VerticalStepStatus.Completed) {\n      <ads-icon name=\"check_circle_filled\" theme=\"success\" stroke=\"success\" size=\"xxs_16\"/>\n    } @else if (status === VerticalStepStatus.Warning) {\n      <ads-icon name=\"warning\" size=\"xxs_16\" />\n    } @else if (status === VerticalStepStatus.InProgress) {\n      <div class=\"step-indicator__circle in-progress\"></div>\n    } @else if (status === VerticalStepStatus.Planned) {\n      <div class=\"step-indicator__circle\"></div>\n    }\n  </div>\n  @if (!isLast) {\n    <div class=\"stepper-connector\"></div>\n  }\n</div>\n<div class=\"stepper-content-wrapper\">\n  <ng-content></ng-content>\n</div>\n\n", styles: [":host{position:relative;display:flex;gap:8px;align-items:stretch}.stepper-indicator-column{display:flex;flex-direction:column;align-items:center;width:16px}.step-indicator{--indicator-size: 16px;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:var(--indicator-size);height:var(--indicator-size)}.step-indicator__circle{all:initial;width:16px!important;height:16px!important;border-radius:50%!important;border:2px solid var(--color-light)!important;background:var(--color-white)!important;display:block!important;box-sizing:border-box!important}.step-indicator__circle.in-progress{border-color:var(--color-secondary)!important}.stepper-connector{flex:1;width:2px;background-color:var(--color-light);min-height:24px}.stepper-content-wrapper{display:flex;flex-direction:column;flex:1;padding-top:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: AdsVerticalStepComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-vertical-step', imports: [CommonModule, AdsIconComponent], changeDetection: ChangeDetectionStrategy.Eager, host: {
+                        class: 'stepper-item',
+                        role: 'listitem',
+                    }, template: "<div class=\"stepper-indicator-column\">\n  <div class=\"step-indicator\">\n    @if (status === VerticalStepStatus.Completed) {\n      <ads-icon name=\"check_circle_filled\" theme=\"success\" stroke=\"success\" size=\"xxs_16\"/>\n    } @else if (status === VerticalStepStatus.Warning) {\n      <ads-icon name=\"warning\" size=\"xxs_16\" />\n    } @else if (status === VerticalStepStatus.InProgress) {\n      <div class=\"step-indicator__circle in-progress\"></div>\n    } @else if (status === VerticalStepStatus.Planned) {\n      <div class=\"step-indicator__circle\"></div>\n    }\n  </div>\n  @if (!isLast) {\n    <div class=\"stepper-connector\"></div>\n  }\n</div>\n<div class=\"stepper-content-wrapper\">\n  <ng-content></ng-content>\n</div>\n\n", styles: [":host{position:relative;display:flex;gap:8px;align-items:stretch}.stepper-indicator-column{display:flex;flex-direction:column;align-items:center;width:16px}.step-indicator{--indicator-size: 16px;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:var(--indicator-size);height:var(--indicator-size)}.step-indicator__circle{all:initial;width:16px!important;height:16px!important;border-radius:50%!important;border:2px solid var(--color-light)!important;background:var(--color-white)!important;display:block!important;box-sizing:border-box!important}.step-indicator__circle.in-progress{border-color:var(--color-secondary)!important}.stepper-connector{flex:1;width:2px;background-color:var(--color-light);min-height:24px}.stepper-content-wrapper{display:flex;flex-direction:column;flex:1;padding-top:0}\n"] }]
+        }], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { status: [{
+                type: Input
+            }] } });
+
+var VerticalStepStatus;
+(function (VerticalStepStatus) {
+    VerticalStepStatus["Planned"] = "planned";
+    VerticalStepStatus["InProgress"] = "in-progress";
+    VerticalStepStatus["Completed"] = "completed";
+    VerticalStepStatus["Warning"] = "warning";
+})(VerticalStepStatus || (VerticalStepStatus = {}));
+class AdsVerticalStepperComponent {
+    ngAfterContentInit() {
+        this.updateLastStep();
+        this.stepComponents.changes.subscribe(() => this.updateLastStep());
+    }
+    updateLastStep() {
+        const steps = this.stepComponents.toArray();
+        steps.forEach((step, i) => {
+            step.isLast = i === steps.length - 1;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: AdsVerticalStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.1", type: AdsVerticalStepperComponent, isStandalone: true, selector: "ads-vertical-stepper", queries: [{ propertyName: "stepComponents", predicate: AdsVerticalStepComponent }], ngImport: i0, template: "<nav class=\"ads-vertical-stepper\" role=\"navigation\" aria-label=\"Step navigation\">\n  <ol class=\"stepper-list\">\n    <ng-content select=\"ads-vertical-step\"></ng-content>\n  </ol>\n</nav>\n\n\n\n", styles: [".ads-vertical-stepper{width:100%}.ads-vertical-stepper .stepper-list{list-style:none;margin:0;padding:0;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: AdsVerticalStepperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ads-vertical-stepper', imports: [CommonModule], template: "<nav class=\"ads-vertical-stepper\" role=\"navigation\" aria-label=\"Step navigation\">\n  <ol class=\"stepper-list\">\n    <ng-content select=\"ads-vertical-step\"></ng-content>\n  </ol>\n</nav>\n\n\n\n", styles: [".ads-vertical-stepper{width:100%}.ads-vertical-stepper .stepper-list{list-style:none;margin:0;padding:0;position:relative}\n"] }]
+        }], propDecorators: { stepComponents: [{
+                type: ContentChildren,
+                args: [AdsVerticalStepComponent]
+            }] } });
+
 function provideAdsUi(config) {
     return [
         { provide: ADS_UI_CONFIG, useValue: config },
@@ -11573,5 +11639,5 @@ function provideAdsUi(config) {
  * Generated bundle index. Do not edit.
  */
 
-export { AdsArchitectureLogoComponent, AdsAscentLogoComponent, AdsAvatarComponent, AdsBaselineWidgetComponent, AdsBreadcrumbComponent, AdsBubbleComponent, AdsButtonComponent, AdsButtonContainerComponent, AdsCardComponent, AdsCheckboxComponent, AdsChipComponent, AdsColumnSortFilterMenuComponent, AdsCreateTagComponent, AdsCurrencyFieldComponent, AdsCustomHeaderComponent, AdsCustomerPortalLogoComponent, AdsCxaLogoComponent, AdsDatepickerComponent, AdsDatetimepickerComponent, AdsDragAndDropListComponent, AdsDropdownComponent, AdsErrorPageCodeComponent, AdsErrorPageComponent, AdsExpansionPanelComponent, AdsFilterMenuComponent, AdsFooterComponent, AdsFooterContainerComponent, AdsGenericLogoComponent, AdsHeaderComponent, AdsHeaderContainerComponent, AdsHistoryStepperComponent, AdsHorizontalNavBarComponent, AdsHorizontalStepperComponent, AdsIconButtonComponent, AdsIconHoverComponent, AdsInputComponent, AdsInputDropdownComponent, AdsInternationalPhoneFieldComponent, AdsLinkButtonComponent, AdsMainMenuComponent, AdsMenuDropDownComponent, AdsMenuDropDownTriggerDirective, AdsModalComponent, AdsMultiSelectDropdownComponent, AdsNavMenuComponent, AdsNavigationCollapseHandleComponent, AdsNavigationComponent, AdsNavigationHeaderComponent, AdsNavigationItemComponent, AdsNavigationItemsContainerComponent, AdsNumericBadgeComponent, AdsNumericStepperComponent, AdsOrgDisplayTextComponent, AdsPeakEssentialsLogoComponent, AdsPeakMarketplaceLogoComponent, AdsPeakOrderManagementLogoComponent, AdsPhoneFieldComponent, AdsPilotPayLogoComponent, AdsPrimaryLogoComponent, AdsProgressBarComponent, AdsProgressIndicatorSpinnerComponent, AdsProgressSpinnerComponent, AdsProgressStepperComponent, AdsRadioButtonComponent, AdsRateOptionCardComponent, AdsScmsLogoComponent, AdsScmsSideNavBarComponent, AdsSearchDropdownComponent, AdsSearchInputComponent, AdsShipmentHorizontalStepperComponent, AdsSideNavBarComponent, AdsSideNavBarV2Component, AdsSlideToggleComponent, AdsSliderComponent, AdsSnackbarComponent, AdsSortMenuComponent, AdsSplashPageComponent, AdsStepperComponent, AdsSubNavigationButtonComponent, AdsTableComponent, AdsTabsComponent, AdsTagComponent, AdsTagContainerComponent, AdsTextareaComponent, AdsTimeFieldComponent, AdsTimepickerComponent, AdsVerticalSideNavigationStepperComponent, AdsWizardStepperComponent, AscentCardComponent, BadgeColor, Colors, CountryCode, CustomDatetimeAdapter, DividerComponent, ErrorPageDefault, HistoryAction, HorizontalStepStatus, MainMenuService, ModalActionType, ModalPanelClass, PanelClass, ShellLayoutComponent, SpinnerSize, StepStatus, TableBreakpoint, ViewportService, WindowService, WizardStepStatus, provideAdsUi };
+export { AdsArchitectureLogoComponent, AdsAscentLogoComponent, AdsAvatarComponent, AdsBaselineWidgetComponent, AdsBreadcrumbComponent, AdsBubbleComponent, AdsButtonComponent, AdsButtonContainerComponent, AdsCardComponent, AdsCheckboxComponent, AdsChipComponent, AdsColumnSortFilterMenuComponent, AdsCreateTagComponent, AdsCurrencyFieldComponent, AdsCustomHeaderComponent, AdsCustomerPortalLogoComponent, AdsCxaLogoComponent, AdsDatepickerComponent, AdsDatetimepickerComponent, AdsDragAndDropListComponent, AdsDropdownComponent, AdsErrorPageCodeComponent, AdsErrorPageComponent, AdsExpansionPanelComponent, AdsFilterMenuComponent, AdsFooterComponent, AdsFooterContainerComponent, AdsGenericLogoComponent, AdsHeaderComponent, AdsHeaderContainerComponent, AdsHistoryStepperComponent, AdsHorizontalNavBarComponent, AdsHorizontalStepperComponent, AdsIconButtonComponent, AdsIconHoverComponent, AdsInputComponent, AdsInputDropdownComponent, AdsInternationalPhoneFieldComponent, AdsLinkButtonComponent, AdsMainMenuComponent, AdsMenuDropDownComponent, AdsMenuDropDownTriggerDirective, AdsModalComponent, AdsMultiSelectDropdownComponent, AdsNavMenuComponent, AdsNavigationCollapseHandleComponent, AdsNavigationComponent, AdsNavigationHeaderComponent, AdsNavigationItemComponent, AdsNavigationItemsContainerComponent, AdsNumericBadgeComponent, AdsNumericStepperComponent, AdsOrgDisplayTextComponent, AdsPeakEssentialsLogoComponent, AdsPeakMarketplaceLogoComponent, AdsPeakOrderManagementLogoComponent, AdsPhoneFieldComponent, AdsPilotPayLogoComponent, AdsPrimaryLogoComponent, AdsProgressBarComponent, AdsProgressIndicatorSpinnerComponent, AdsProgressSpinnerComponent, AdsProgressStepperComponent, AdsRadioButtonComponent, AdsRateOptionCardComponent, AdsScmsLogoComponent, AdsScmsSideNavBarComponent, AdsSearchDropdownComponent, AdsSearchInputComponent, AdsShipmentHorizontalStepperComponent, AdsSideNavBarComponent, AdsSideNavBarV2Component, AdsSlideToggleComponent, AdsSliderComponent, AdsSnackbarComponent, AdsSortMenuComponent, AdsSplashPageComponent, AdsStepperComponent, AdsSubNavigationButtonComponent, AdsTableComponent, AdsTabsComponent, AdsTagComponent, AdsTagContainerComponent, AdsTextareaComponent, AdsTimeFieldComponent, AdsTimepickerComponent, AdsVerticalSideNavigationStepperComponent, AdsVerticalStepComponent, AdsVerticalStepperComponent, AdsWizardStepperComponent, AscentCardComponent, BadgeColor, Colors, CountryCode, CustomDatetimeAdapter, DividerComponent, ErrorPageDefault, HistoryAction, HorizontalStepStatus, MainMenuService, ModalActionType, ModalPanelClass, PanelClass, ShellLayoutComponent, SpinnerSize, StepStatus, TableBreakpoint, VerticalStepStatus, ViewportService, WindowService, WizardStepStatus, provideAdsUi };
 //# sourceMappingURL=ascentgl-ads-ui.mjs.map