@spicainternational/ngx-sds-components 8.3.1 → 8.5.0-beta.0

package/esm2022/src/lib/segmented-control/segmented-control.component.mjs

@@ -1,20 +1,42 @@
-import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewChild, } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Injector, Input, Output, ViewChild, inject, input, viewChild, } from '@angular/core';
+import { NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
 import { NgClass, NgFor, NgIf } from '@angular/common';
 import * as i0 from "@angular/core";
 export class SdsSegmentedControlComponent {
-    constructor(cdr) {
-        this.cdr = cdr;
-        this.segmentPadding = 'loose';
-        this.enableAnimation = true;
-        this.itemChange = new EventEmitter();
-        this.valueChange = new EventEmitter();
+    constructor() {
+        // #region Dependencies
+        this._cdr = inject(ChangeDetectorRef);
+        this._injector = inject(Injector);
         this.valueExpr = 'value';
         this.displayExpr = 'text';
         this.disabled = false;
         this.style = 'default';
+        this.segmentPadding = 'loose';
+        this.enableAnimation = true;
+        this.ariaLabel = input();
+        // #endregion Inputs
+        // #region Outputs
+        this.itemChange = new EventEmitter();
+        this.valueChange = new EventEmitter();
+        this.containerRef = viewChild('containerRef');
+        // #endregion DOM references
+        // #region ControlValueAccessor private state
+        this._ngControl = null;
+        this._onChange = () => { };
+        this._onTouched = () => { };
+    }
+    // #endregion ControlValueAccessor private state
+    ngOnInit() {
+        /**
+         * Don't inject ngControl at the constructor, because it causes Cyclic Dependency.
+         * We can inject it via Injector to avoid the error.
+         */
+        this._ngControl = this._injector.get(NgControl, null);
+        if (this._ngControl !== null) {
+            this._ngControl.valueAccessor = this;
+        }
     }
-    ngOnInit() { }
     ngAfterViewInit() {
         if (this.enableAnimation) {
             this.updateClipPath();
@@ -26,18 +48,114 @@ export class SdsSegmentedControlComponent {
             setTimeout(() => this.updateClipPath(), 50);
         }
     }
+    // #region ControlValueAccessor implementation
+    writeValue(value) {
+        if (value !== undefined && value !== null) {
+            this.value = value;
+            this._cdr.markForCheck();
+        }
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+        this._cdr.markForCheck();
+    }
+    // #endregion ControlValueAccessor implementation
     selectItem(item, event) {
         event.stopPropagation();
         if (!this.disabled) {
             this.value = item[this.valueExpr];
             this.valueChange.emit(this.value);
             this.itemChange.emit(item);
+            // Notify form control if in form context
+            if (this._ngControl) {
+                this._onChange(this.value);
+                this._onTouched();
+            }
             if (this.enableAnimation) {
-                this.cdr.detectChanges();
+                this._cdr.detectChanges();
                 this.updateClipPath();
             }
         }
     }
+    onSegmentKeydown(event, item) {
+        if (this.disabled) {
+            return;
+        }
+        const currentIndex = this.getItemIndex(item);
+        let nextIndex = null;
+        switch (event.key) {
+            case 'ArrowLeft':
+                event.preventDefault();
+                nextIndex = currentIndex > 0 ? currentIndex - 1 : (this.items?.length ?? 1) - 1;
+                break;
+            case 'ArrowRight':
+                event.preventDefault();
+                nextIndex = currentIndex < (this.items?.length ?? 1) - 1 ? currentIndex + 1 : 0;
+                break;
+            case 'Home':
+                event.preventDefault();
+                nextIndex = 0;
+                break;
+            case 'End':
+                event.preventDefault();
+                nextIndex = (this.items?.length ?? 1) - 1;
+                break;
+        }
+        if (nextIndex !== null && this.items) {
+            this.navigateToItem(nextIndex);
+        }
+    }
+    getSegmentAriaLabel(item, index) {
+        // Only set an explicit aria-label when visible text is intentionally omitted.
+        if (this.displayExpr) {
+            return null;
+        }
+        if (this.tooltipExpr && item?.[this.tooltipExpr]) {
+            return String(item[this.tooltipExpr]);
+        }
+        if (item?.[this.valueExpr] !== undefined && item?.[this.valueExpr] !== null) {
+            return String(item[this.valueExpr]);
+        }
+        return `Segment option ${index + 1}`;
+    }
+    getItemIndex(item) {
+        return this.items?.indexOf(item) ?? -1;
+    }
+    navigateToItem(index) {
+        if (!this.items || index < 0 || index >= this.items.length) {
+            return;
+        }
+        const item = this.items[index];
+        this.value = item[this.valueExpr];
+        this.valueChange.emit(this.value);
+        this.itemChange.emit(item);
+        // Notify form control if in form context
+        if (this._ngControl) {
+            this._onChange(this.value);
+            this._onTouched();
+        }
+        if (this.enableAnimation) {
+            this._cdr.detectChanges();
+            this.updateClipPath();
+        }
+        // Focus the segment element after change detection
+        this.focusSegmentElement(index);
+    }
+    focusSegmentElement(index) {
+        // Use setTimeout to ensure DOM is updated before focusing
+        setTimeout(() => {
+            const segmentElements = this.containerRef()?.nativeElement.querySelectorAll('.segment:not(.segment-overlay)');
+            if (segmentElements && segmentElements[index]) {
+                segmentElements[index].focus();
+            }
+        }, 0);
+    }
     updateClipPath() {
         setTimeout(() => {
             const container = this.clipPathContainerRef?.nativeElement;
@@ -65,8 +183,14 @@ export class SdsSegmentedControlComponent {
             }
         }, 0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsSegmentedControlComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsSegmentedControlComponent, isStandalone: true, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style", segmentPadding: "segmentPadding", enableAnimation: "enableAnimation" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, viewQueries: [{ propertyName: "clipPathContainerRef", first: true, predicate: ["clipPathContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div \n    class=\"sds-segmented-control-container\" \n    [ngClass]=\"{\n        'disabled': disabled,\n        'sds-segmented-control-primary': style == 'primary',\n        'sds-segmented-control-inverted': style == 'inverted',\n        'clip-path-enabled': enableAnimation\n    }\">\n    \n    <div *ngFor=\"let item of items; let last = last;\" \n        class=\"segment\" \n        id=\"{{idExpr ? item[idExpr]: ''}}\"\n        [class.selected]=\"item[valueExpr] == value\"\n        [class.tight-padding]=\"segmentPadding == 'tight'\"\n        [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\n        (click)=\"selectItem(item, $event)\">\n\n        <div class=\"sds-flex-row-center gap-2\">\n            <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n            <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n        </div>\n    </div>\n\n    <div *ngIf=\"enableAnimation\" \n         class=\"sds-clip-path-overlay\" \n         #clipPathContainer \n         aria-hidden=\"true\">\n        <div *ngFor=\"let item of items; let last = last;\" \n            class=\"segment segment-overlay\" \n            [class.tight-padding]=\"segmentPadding == 'tight'\"\n            [tabIndex]=\"-1\">\n\n            <div class=\"sds-flex-row-center gap-2\">\n                <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n                <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n            </div>\n        </div>\n    </div>\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}.sds-segmented-control-container{display:inline-block;padding:max(.125rem,2px);border-style:solid;border-width:1px;border-radius:6px;border-color:#ced4da;background-color:#fff;font-size:.9rem;position:relative;white-space:nowrap}.sds-segmented-control-container .disabled{pointer-events:none;opacity:.5;background:#ced4da}.sds-segmented-control-container .segment{display:inline-block;border-radius:4px;color:#343434;cursor:pointer;color:#000;font-weight:500;margin-left:auto;margin-right:auto;padding:.25rem 1rem;-webkit-user-select:none;user-select:none}.sds-segmented-control-container .segment.selected{background-color:var(--bs-gray-300)}.sds-segmented-control-container .segment.selected .separator{border-color:transparent}.sds-segmented-control-container .segment:hover:not(.selected){background-color:transparent}.sds-segmented-control-container.disabled{pointer-events:none;opacity:.5;cursor:default}.sds-segmented-control-container.sds-segmented-control-primary .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-container.sds-segmented-control-inverted .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-container.clip-path-enabled .segment.selected{background-color:initial;color:initial}.sds-segmented-control-container .sds-clip-path-overlay{position:absolute;top:max(.125rem,2px);left:max(.125rem,2px);right:max(.125rem,2px);bottom:max(.125rem,2px);display:flex;z-index:1;overflow:hidden;transition:clip-path .25s ease;pointer-events:none;border-radius:4px;background-color:var(--bs-gray-300)}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000;font-weight:500;background:transparent}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay:hover{background:transparent}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay .segment-overlay{color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-light .sds-segmented-control-container{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-light .sds-segmented-control-container .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-primary .sds-segmented-control-container .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#fff}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "17.3.12", type: SdsSegmentedControlComponent, isStandalone: true, selector: "sds-segmented-control", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, valueExpr: { classPropertyName: "valueExpr", publicName: "valueExpr", isSignal: false, isRequired: false, transformFunction: null }, displayExpr: { classPropertyName: "displayExpr", publicName: "displayExpr", isSignal: false, isRequired: false, transformFunction: null }, iconExpr: { classPropertyName: "iconExpr", publicName: "iconExpr", isSignal: false, isRequired: false, transformFunction: null }, tooltipExpr: { classPropertyName: "tooltipExpr", publicName: "tooltipExpr", isSignal: false, isRequired: false, transformFunction: null }, idExpr: { classPropertyName: "idExpr", publicName: "idExpr", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: false, isRequired: false, transformFunction: null }, segmentPadding: { classPropertyName: "segmentPadding", publicName: "segmentPadding", isSignal: false, isRequired: false, transformFunction: null }, enableAnimation: { classPropertyName: "enableAnimation", publicName: "enableAnimation", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: SdsSegmentedControlComponent,
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true, isSignal: true }, { propertyName: "clipPathContainerRef", first: true, predicate: ["clipPathContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n    #containerRef\n    class=\"sds-segmented-control-container\"\n    role=\"group\"\n    [attr.aria-label]=\"ariaLabel() || 'Segmented control'\"\n    [ngClass]=\"{\n        'disabled': disabled,\n        'sds-segmented-control-primary': style == 'primary',\n        'sds-segmented-control-inverted': style == 'inverted',\n        'clip-path-enabled': enableAnimation\n    }\">\n\n    <div *ngFor=\"let item of items; let index = index; let last = last;\"\n        class=\"segment\"\n        id=\"{{idExpr ? item[idExpr]: ''}}\"\n        role=\"button\"\n        [tabindex]=\"item[valueExpr] === value ? 0 : -1\"\n        [attr.aria-label]=\"getSegmentAriaLabel(item, index)\"\n        [attr.aria-pressed]=\"item[valueExpr] === value\"\n        [class.selected]=\"item[valueExpr] == value\"\n        [class.tight-padding]=\"segmentPadding == 'tight'\"\n        [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\n        (click)=\"selectItem(item, $event)\"\n        (keydown)=\"onSegmentKeydown($event, item)\">\n\n        <div class=\"sds-flex-row-center gap-2\">\n            <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n            <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n        </div>\n    </div>\n\n    <div *ngIf=\"enableAnimation\"\n         class=\"sds-clip-path-overlay\"\n         #clipPathContainer\n         aria-hidden=\"true\">\n        <div *ngFor=\"let item of items; let last = last;\"\n            class=\"segment segment-overlay\"\n            [class.tight-padding]=\"segmentPadding == 'tight'\"\n            [tabIndex]=\"-1\">\n\n            <div class=\"sds-flex-row-center gap-2\">\n                <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n                <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}.sds-segmented-control-container{display:inline-block;padding:max(.125rem,2px);border-style:solid;border-width:1px;border-radius:6px;border-color:#ced4da;background-color:#fff;font-size:.9rem;position:relative;white-space:nowrap;outline:none;transition:box-shadow .15s ease}.sds-segmented-control-container:focus-within{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--bs-primary)}.sds-segmented-control-container .disabled{pointer-events:none;opacity:.5;background:#ced4da}.sds-segmented-control-container .segment{display:inline-block;border-radius:4px;color:#343434;cursor:pointer;color:#000;font-weight:500;margin-left:auto;margin-right:auto;padding:.25rem 1rem;-webkit-user-select:none;user-select:none;outline:none;transition:box-shadow .15s ease}.sds-segmented-control-container .segment.selected{background-color:var(--bs-gray-300)}.sds-segmented-control-container .segment.selected .separator{border-color:transparent}.sds-segmented-control-container .segment:hover:not(.selected){background-color:transparent}.sds-segmented-control-container .segment:focus-visible{box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px var(--bs-primary);border-radius:4px}.sds-segmented-control-container.disabled{pointer-events:none;opacity:.5;cursor:default}.sds-segmented-control-container.sds-segmented-control-primary .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-container.sds-segmented-control-primary .segment:focus-visible{box-shadow:inset 0 0 0 2px var(--bs-primary),inset 0 0 0 4px #fff}.sds-segmented-control-container.sds-segmented-control-primary:focus-within{box-shadow:0 0 0 2px var(--bs-primary),0 0 0 4px #fff}.sds-segmented-control-container.sds-segmented-control-inverted{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-container.sds-segmented-control-inverted .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-container.sds-segmented-control-inverted .segment:focus-visible{box-shadow:inset 0 0 0 2px var(--bs-gray-300),inset 0 0 0 4px var(--bs-primary)}.sds-segmented-control-container.sds-segmented-control-inverted:focus-within{box-shadow:0 0 0 2px var(--bs-gray-300),0 0 0 4px var(--bs-primary)}.sds-segmented-control-container.clip-path-enabled .segment.selected{background-color:initial;color:initial}.sds-segmented-control-container .sds-clip-path-overlay{position:absolute;top:max(.125rem,2px);left:max(.125rem,2px);right:max(.125rem,2px);bottom:max(.125rem,2px);display:flex;z-index:1;overflow:hidden;transition:clip-path .25s ease;pointer-events:none;border-radius:4px;background-color:var(--bs-gray-300)}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000;font-weight:500;background:transparent}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay:hover{background:transparent}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay .segment-overlay{color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-light .sds-segmented-control-container{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-light .sds-segmented-control-container .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-primary .sds-segmented-control-container .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#fff}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsSegmentedControlComponent, decorators: [{
             type: Component,
@@ -75,11 +199,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         NgFor,
                         NgIf,
                         FaIconComponent,
-                    ], template: "<div \n    class=\"sds-segmented-control-container\" \n    [ngClass]=\"{\n        'disabled': disabled,\n        'sds-segmented-control-primary': style == 'primary',\n        'sds-segmented-control-inverted': style == 'inverted',\n        'clip-path-enabled': enableAnimation\n    }\">\n    \n    <div *ngFor=\"let item of items; let last = last;\" \n        class=\"segment\" \n        id=\"{{idExpr ? item[idExpr]: ''}}\"\n        [class.selected]=\"item[valueExpr] == value\"\n        [class.tight-padding]=\"segmentPadding == 'tight'\"\n        [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\n        (click)=\"selectItem(item, $event)\">\n\n        <div class=\"sds-flex-row-center gap-2\">\n            <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n            <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n        </div>\n    </div>\n\n    <div *ngIf=\"enableAnimation\" \n         class=\"sds-clip-path-overlay\" \n         #clipPathContainer \n         aria-hidden=\"true\">\n        <div *ngFor=\"let item of items; let last = last;\" \n            class=\"segment segment-overlay\" \n            [class.tight-padding]=\"segmentPadding == 'tight'\"\n            [tabIndex]=\"-1\">\n\n            <div class=\"sds-flex-row-center gap-2\">\n                <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n                <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n            </div>\n        </div>\n    </div>\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}.sds-segmented-control-container{display:inline-block;padding:max(.125rem,2px);border-style:solid;border-width:1px;border-radius:6px;border-color:#ced4da;background-color:#fff;font-size:.9rem;position:relative;white-space:nowrap}.sds-segmented-control-container .disabled{pointer-events:none;opacity:.5;background:#ced4da}.sds-segmented-control-container .segment{display:inline-block;border-radius:4px;color:#343434;cursor:pointer;color:#000;font-weight:500;margin-left:auto;margin-right:auto;padding:.25rem 1rem;-webkit-user-select:none;user-select:none}.sds-segmented-control-container .segment.selected{background-color:var(--bs-gray-300)}.sds-segmented-control-container .segment.selected .separator{border-color:transparent}.sds-segmented-control-container .segment:hover:not(.selected){background-color:transparent}.sds-segmented-control-container.disabled{pointer-events:none;opacity:.5;cursor:default}.sds-segmented-control-container.sds-segmented-control-primary .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-container.sds-segmented-control-inverted .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-container.clip-path-enabled .segment.selected{background-color:initial;color:initial}.sds-segmented-control-container .sds-clip-path-overlay{position:absolute;top:max(.125rem,2px);left:max(.125rem,2px);right:max(.125rem,2px);bottom:max(.125rem,2px);display:flex;z-index:1;overflow:hidden;transition:clip-path .25s ease;pointer-events:none;border-radius:4px;background-color:var(--bs-gray-300)}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000;font-weight:500;background:transparent}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay:hover{background:transparent}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay .segment-overlay{color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-light .sds-segmented-control-container{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-light .sds-segmented-control-container .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-primary .sds-segmented-control-container .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#fff}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { clipPathContainerRef: [{
-                type: ViewChild,
-                args: ['clipPathContainer']
-            }], items: [{
+                    ], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: SdsSegmentedControlComponent,
+                            multi: true,
+                        },
+                    ], template: "<div\n    #containerRef\n    class=\"sds-segmented-control-container\"\n    role=\"group\"\n    [attr.aria-label]=\"ariaLabel() || 'Segmented control'\"\n    [ngClass]=\"{\n        'disabled': disabled,\n        'sds-segmented-control-primary': style == 'primary',\n        'sds-segmented-control-inverted': style == 'inverted',\n        'clip-path-enabled': enableAnimation\n    }\">\n\n    <div *ngFor=\"let item of items; let index = index; let last = last;\"\n        class=\"segment\"\n        id=\"{{idExpr ? item[idExpr]: ''}}\"\n        role=\"button\"\n        [tabindex]=\"item[valueExpr] === value ? 0 : -1\"\n        [attr.aria-label]=\"getSegmentAriaLabel(item, index)\"\n        [attr.aria-pressed]=\"item[valueExpr] === value\"\n        [class.selected]=\"item[valueExpr] == value\"\n        [class.tight-padding]=\"segmentPadding == 'tight'\"\n        [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\n        (click)=\"selectItem(item, $event)\"\n        (keydown)=\"onSegmentKeydown($event, item)\">\n\n        <div class=\"sds-flex-row-center gap-2\">\n            <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n            <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n        </div>\n    </div>\n\n    <div *ngIf=\"enableAnimation\"\n         class=\"sds-clip-path-overlay\"\n         #clipPathContainer\n         aria-hidden=\"true\">\n        <div *ngFor=\"let item of items; let last = last;\"\n            class=\"segment segment-overlay\"\n            [class.tight-padding]=\"segmentPadding == 'tight'\"\n            [tabIndex]=\"-1\">\n\n            <div class=\"sds-flex-row-center gap-2\">\n                <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\n                <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}.sds-segmented-control-container{display:inline-block;padding:max(.125rem,2px);border-style:solid;border-width:1px;border-radius:6px;border-color:#ced4da;background-color:#fff;font-size:.9rem;position:relative;white-space:nowrap;outline:none;transition:box-shadow .15s ease}.sds-segmented-control-container:focus-within{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--bs-primary)}.sds-segmented-control-container .disabled{pointer-events:none;opacity:.5;background:#ced4da}.sds-segmented-control-container .segment{display:inline-block;border-radius:4px;color:#343434;cursor:pointer;color:#000;font-weight:500;margin-left:auto;margin-right:auto;padding:.25rem 1rem;-webkit-user-select:none;user-select:none;outline:none;transition:box-shadow .15s ease}.sds-segmented-control-container .segment.selected{background-color:var(--bs-gray-300)}.sds-segmented-control-container .segment.selected .separator{border-color:transparent}.sds-segmented-control-container .segment:hover:not(.selected){background-color:transparent}.sds-segmented-control-container .segment:focus-visible{box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px var(--bs-primary);border-radius:4px}.sds-segmented-control-container.disabled{pointer-events:none;opacity:.5;cursor:default}.sds-segmented-control-container.sds-segmented-control-primary .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-container.sds-segmented-control-primary .segment:focus-visible{box-shadow:inset 0 0 0 2px var(--bs-primary),inset 0 0 0 4px #fff}.sds-segmented-control-container.sds-segmented-control-primary:focus-within{box-shadow:0 0 0 2px var(--bs-primary),0 0 0 4px #fff}.sds-segmented-control-container.sds-segmented-control-inverted{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-container.sds-segmented-control-inverted .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-container.sds-segmented-control-inverted .segment:focus-visible{box-shadow:inset 0 0 0 2px var(--bs-gray-300),inset 0 0 0 4px var(--bs-primary)}.sds-segmented-control-container.sds-segmented-control-inverted:focus-within{box-shadow:0 0 0 2px var(--bs-gray-300),0 0 0 4px var(--bs-primary)}.sds-segmented-control-container.clip-path-enabled .segment.selected{background-color:initial;color:initial}.sds-segmented-control-container .sds-clip-path-overlay{position:absolute;top:max(.125rem,2px);left:max(.125rem,2px);right:max(.125rem,2px);bottom:max(.125rem,2px);display:flex;z-index:1;overflow:hidden;transition:clip-path .25s ease;pointer-events:none;border-radius:4px;background-color:var(--bs-gray-300)}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000;font-weight:500;background:transparent}.sds-segmented-control-container .sds-clip-path-overlay .segment-overlay:hover{background:transparent}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-container.sds-segmented-control-primary .sds-clip-path-overlay .segment-overlay{color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-container.sds-segmented-control-inverted .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-light .sds-segmented-control-container{background-color:var(--bs-gray-300);border-color:var(--bs-gray-300);border-width:0}.sds-segmented-control-light .sds-segmented-control-container .segment.selected{background-color:#fff;color:#000}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay{background-color:#fff}.sds-segmented-control-light .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#000}.sds-segmented-control-primary .sds-segmented-control-container .segment.selected{background-color:var(--bs-primary);color:#fff}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay{background-color:var(--bs-primary)}.sds-segmented-control-primary .sds-segmented-control-container .sds-clip-path-overlay .segment-overlay{color:#fff}\n"] }]
+        }], propDecorators: { items: [{
                 type: Input
             }], value: [{
                 type: Input
@@ -105,5 +232,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Output
             }], valueChange: [{
                 type: Output
+            }], clipPathContainerRef: [{
+                type: ViewChild,
+                args: ['clipPathContainer']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUVILHVCQUF1QixFQUV2QixTQUFTLEVBRVQsWUFBWSxFQUNaLEtBQUssRUFHTCxNQUFNLEVBRU4sU0FBUyxHQUNaLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUNuRSxPQUFPLEVBQUUsT0FBTyxFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7QUFldkQsTUFBTSxPQUFPLDRCQUE0QjtJQWtCckMsWUFBb0IsR0FBc0I7UUFBdEIsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUFOakMsbUJBQWMsR0FBc0IsT0FBTyxDQUFDO1FBQzVDLG9CQUFlLEdBQVksSUFBSSxDQUFDO1FBRS9CLGVBQVUsR0FBc0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUNuRCxnQkFBVyxHQUFzQixJQUFJLFlBQVksRUFBRSxDQUFDO1FBRzFELElBQUksQ0FBQyxTQUFTLEdBQUcsT0FBTyxDQUFDO1FBQ3pCLElBQUksQ0FBQyxXQUFXLEdBQUcsTUFBTSxDQUFDO1FBQzFCLElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ3RCLElBQUksQ0FBQyxLQUFLLEdBQUcsU0FBUyxDQUFDO0lBQzNCLENBQUM7SUFFRCxRQUFRLEtBQUksQ0FBQztJQUViLGVBQWU7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TCxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUM7SUFDVixDQUFDOytHQTFGUSw0QkFBNEI7bUdBQTVCLDRCQUE0QixvakJDOUJ6Qyw0akRBc0NNLHEwR0RkRSxPQUFPLG9GQUNQLEtBQUssbUhBQ0wsSUFBSSw2RkFDSixlQUFlOzs0RkFHViw0QkFBNEI7a0JBYnhDLFNBQVM7K0JBQ0ksdUJBQXVCLG1CQUdoQix1QkFBdUIsQ0FBQyxNQUFNLGNBQ25DLElBQUksV0FDUDt3QkFDTCxPQUFPO3dCQUNQLEtBQUs7d0JBQ0wsSUFBSTt3QkFDSixlQUFlO3FCQUNsQjtzRkFHK0Isb0JBQW9CO3NCQUFuRCxTQUFTO3VCQUFDLG1CQUFtQjtnQkFFckIsS0FBSztzQkFBYixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBRUksVUFBVTtzQkFBbkIsTUFBTTtnQkFDRyxXQUFXO3NCQUFwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgICBBZnRlclZpZXdJbml0LFxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENoYW5nZURldGVjdG9yUmVmLFxuICAgIENvbXBvbmVudCxcbiAgICBFbGVtZW50UmVmLFxuICAgIEV2ZW50RW1pdHRlcixcbiAgICBJbnB1dCxcbiAgICBPbkNoYW5nZXMsXG4gICAgT25Jbml0LFxuICAgIE91dHB1dCxcbiAgICBTaW1wbGVDaGFuZ2VzLFxuICAgIFZpZXdDaGlsZCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGYUljb25Db21wb25lbnQgfSBmcm9tICdAZm9ydGF3ZXNvbWUvYW5ndWxhci1mb250YXdlc29tZSc7XG5pbXBvcnQgeyBOZ0NsYXNzLCBOZ0ZvciwgTmdJZiB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnc2RzLXNlZ21lbnRlZC1jb250cm9sJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3NlZ21lbnRlZC1jb250cm9sLmNvbXBvbmVudC5zY3NzJ10sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgICBpbXBvcnRzOiBbXG4gICAgICAgIE5nQ2xhc3MsXG4gICAgICAgIE5nRm9yLFxuICAgICAgICBOZ0lmLFxuICAgICAgICBGYUljb25Db21wb25lbnQsXG4gICAgXSxcbn0pXG5leHBvcnQgY2xhc3MgU2RzU2VnbWVudGVkQ29udHJvbENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgQWZ0ZXJWaWV3SW5pdCwgT25DaGFuZ2VzIHtcbiAgICBAVmlld0NoaWxkKCdjbGlwUGF0aENvbnRhaW5lcicpIGNsaXBQYXRoQ29udGFpbmVyUmVmITogRWxlbWVudFJlZjxIVE1MRGl2RWxlbWVudD47XG5cbiAgICBASW5wdXQoKSBpdGVtczogYW55W10gfCB1bmRlZmluZWQ7XG4gICAgQElucHV0KCkgdmFsdWU6IGFueTtcbiAgICBASW5wdXQoKSB2YWx1ZUV4cHI7XG4gICAgQElucHV0KCkgZGlzcGxheUV4cHI6IHN0cmluZyB8IHVuZGVmaW5lZDtcbiAgICBASW5wdXQoKSBpY29uRXhwcjogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICAgIEBJbnB1dCgpIHRvb2x0aXBFeHByOiBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gICAgQElucHV0KCkgaWRFeHByOiBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gICAgQElucHV0KCkgZGlzYWJsZWQ6IGJvb2xlYW47XG4gICAgQElucHV0KCkgc3R5bGU6ICdkZWZhdWx0JyB8ICdwcmltYXJ5JyB8ICdpbnZlcnRlZCc7XG4gICAgQElucHV0KCkgc2VnbWVudFBhZGRpbmc6ICd0aWdodCcgfCAnbG9vc2UnID0gJ2xvb3NlJztcbiAgICBASW5wdXQoKSBlbmFibGVBbmltYXRpb246IGJvb2xlYW4gPSB0cnVlO1xuXG4gICAgQE91dHB1dCgpIGl0ZW1DaGFuZ2U6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICAgIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZTogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNkcjogQ2hhbmdlRGV0ZWN0b3JSZWYpIHtcbiAgICAgICAgdGhpcy52YWx1ZUV4cHIgPSAndmFsdWUnO1xuICAgICAgICB0aGlzLmRpc3BsYXlFeHByID0gJ3RleHQnO1xuICAgICAgICB0aGlzLmRpc2FibGVkID0gZmFsc2U7XG4gICAgICAgIHRoaXMuc3R5bGUgPSAnZGVmYXVsdCc7XG4gICAgfVxuXG4gICAgbmdPbkluaXQoKSB7fVxuXG4gICAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgICAgICBpZiAodGhpcy5lbmFibGVBbmltYXRpb24pIHtcbiAgICAgICAgICAgIHRoaXMudXBkYXRlQ2xpcFBhdGgoKTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcbiAgICAgICAgaWYgKChjaGFuZ2VzWyd2YWx1ZSddIHx8IGNoYW5nZXNbJ2VuYWJsZUNsaXBQYXRoQW5pbWF0aW9uJ10pICYmIHRoaXMuZW5hYmxlQW5pbWF0aW9uKSB7XG4gICAgICAgICAgICAvLyBVc2UgYSBsb25nZXIgdGltZW91dCB0byBlbnN1cmUgdGhlIERPTSBpcyB1cGRhdGVkXG4gICAgICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHRoaXMudXBkYXRlQ2xpcFBhdGgoKSwgNTApO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgcHVibGljIHNlbGVjdEl0ZW0oaXRlbTogYW55LCBldmVudDogTW91c2VFdmVudCk6IHZvaWQge1xuICAgICAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcblxuICAgICAgICBpZiAoIXRoaXMuZGlzYWJsZWQpIHtcbiAgICAgICAgICAgIHRoaXMudmFsdWUgPSBpdGVtW3RoaXMudmFsdWVFeHByXTtcbiAgICAgICAgICAgIHRoaXMudmFsdWVDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcbiAgICAgICAgICAgIHRoaXMuaXRlbUNoYW5nZS5lbWl0KGl0ZW0pO1xuXG4gICAgICAgICAgICBpZiAodGhpcy5lbmFibGVBbmltYXRpb24pIHtcbiAgICAgICAgICAgICAgICB0aGlzLmNkci5kZXRlY3RDaGFuZ2VzKCk7IFxuICAgICAgICAgICAgICAgIHRoaXMudXBkYXRlQ2xpcFBhdGgoKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cblxuICAgIHByaXZhdGUgdXBkYXRlQ2xpcFBhdGgoKSB7XG4gICAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgICAgY29uc3QgY29udGFpbmVyID0gdGhpcy5jbGlwUGF0aENvbnRhaW5lclJlZj8ubmF0aXZlRWxlbWVudDtcbiAgICAgICAgICAgIGlmICghY29udGFpbmVyKSByZXR1cm47XG5cbiAgICAgICAgICAgIGNvbnN0IGFjdGl2ZVNlZ21lbnQgPSBjb250YWluZXIucGFyZW50RWxlbWVudD8ucXVlcnlTZWxlY3RvcihcbiAgICAgICAgICAgICAgICBgLnNlZ21lbnQuc2VsZWN0ZWQ6bm90KC5zZWdtZW50LW92ZXJsYXkpYFxuICAgICAgICAgICAgKSBhcyBIVE1MRWxlbWVudDtcblxuICAgICAgICAgICAgaWYgKGFjdGl2ZVNlZ21lbnQgJiYgY29udGFpbmVyLnBhcmVudEVsZW1lbnQpIHtcbiAgICAgICAgICAgICAgICBjb25zdCBwYXJlbnRFbGVtZW50ID0gY29udGFpbmVyLnBhcmVudEVsZW1lbnQ7XG4gICAgICAgICAgICAgICAgXG4gICAgICAgICAgICAgICAgY29uc3QgY29tcHV0ZWRTdHlsZSA9IHdpbmRvdy5nZXRDb21wdXRlZFN0eWxlKHBhcmVudEVsZW1lbnQpO1xuICAgICAgICAgICAgICAgIGNvbnN0IHBhZGRpbmdMZWZ0ID0gcGFyc2VGbG9hdChjb21wdXRlZFN0eWxlLnBhZGRpbmdMZWZ0KTtcbiAgICAgICAgICAgICAgICBcbiAgICAgICAgICAgICAgICBjb25zdCBvZmZzZXRMZWZ0ID0gYWN0aXZlU2VnbWVudC5vZmZzZXRMZWZ0IC0gcGFkZGluZ0xlZnQ7XG4gICAgICAgICAgICAgICAgY29uc3Qgb2Zmc2V0V2lkdGggPSBhY3RpdmVTZWdtZW50Lm9mZnNldFdpZHRoO1xuICAgICAgICAgICAgICAgIGNvbnN0IG92ZXJsYXlXaWR0aCA9IGNvbnRhaW5lci5vZmZzZXRXaWR0aDtcblxuICAgICAgICAgICAgICAgIC8vIE9ubHkgdXBkYXRlIGlmIHdlIGhhdmUgdmFsaWQgZGltZW5zaW9uc1xuICAgICAgICAgICAgICAgIGlmIChvZmZzZXRXaWR0aCA9PT0gMCB8fCBvdmVybGF5V2lkdGggPT09IDApIHtcbiAgICAgICAgICAgICAgICAgICAgLy8gUmV0cnkgYWZ0ZXIgYSBzaG9ydCBkZWxheSBpZiBlbGVtZW50cyBhcmVuJ3QgcmVuZGVyZWQgeWV0XG4gICAgICAgICAgICAgICAgICAgIHNldFRpbWVvdXQoKCkgPT4gdGhpcy51cGRhdGVDbGlwUGF0aCgpLCAxMDApO1xuICAgICAgICAgICAgICAgICAgICByZXR1cm47XG4gICAgICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICAgICAgY29uc3QgY2xpcExlZnQgPSBvZmZzZXRMZWZ0O1xuICAgICAgICAgICAgICAgIGNvbnN0IGNsaXBSaWdodCA9IG9mZnNldExlZnQgKyBvZmZzZXRXaWR0aDtcbiAgICAgICAgICAgICAgICBcbiAgICAgICAgICAgICAgICBjb25zdCBjbGlwTGVmdFBlcmNlbnQgPSAoKGNsaXBMZWZ0IC8gb3ZlcmxheVdpZHRoKSAqIDEwMCkudG9GaXhlZCgyKTtcbiAgICAgICAgICAgICAgICBjb25zdCBjbGlwUmlnaHRQZXJjZW50ID0gKDEwMCAtIChjbGlwUmlnaHQgLyBvdmVybGF5V2lkdGgpICogMTAwKS50b0ZpeGVkKDIpO1xuICAgICAgICAgICAgICAgIFxuICAgICAgICAgICAgICAgIGNvbnRhaW5lci5zdHlsZS5jbGlwUGF0aCA9IGBpbnNldCgwICR7Y2xpcFJpZ2h0UGVyY2VudH0lIDAgJHtjbGlwTGVmdFBlcmNlbnR9JSByb3VuZCA0cHgpYDtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfSwgMCk7XG4gICAgfVxufSIsIjxkaXYgXG4gICAgY2xhc3M9XCJzZHMtc2VnbWVudGVkLWNvbnRyb2wtY29udGFpbmVyXCIgXG4gICAgW25nQ2xhc3NdPVwie1xuICAgICAgICAnZGlzYWJsZWQnOiBkaXNhYmxlZCxcbiAgICAgICAgJ3Nkcy1zZWdtZW50ZWQtY29udHJvbC1wcmltYXJ5Jzogc3R5bGUgPT0gJ3ByaW1hcnknLFxuICAgICAgICAnc2RzLXNlZ21lbnRlZC1jb250cm9sLWludmVydGVkJzogc3R5bGUgPT0gJ2ludmVydGVkJyxcbiAgICAgICAgJ2NsaXAtcGF0aC1lbmFibGVkJzogZW5hYmxlQW5pbWF0aW9uXG4gICAgfVwiPlxuICAgIFxuICAgIDxkaXYgKm5nRm9yPVwibGV0IGl0ZW0gb2YgaXRlbXM7IGxldCBsYXN0ID0gbGFzdDtcIiBcbiAgICAgICAgY2xhc3M9XCJzZWdtZW50XCIgXG4gICAgICAgIGlkPVwie3tpZEV4cHIgPyBpdGVtW2lkRXhwcl06ICcnfX1cIlxuICAgICAgICBbY2xhc3Muc2VsZWN0ZWRdPVwiaXRlbVt2YWx1ZUV4cHJdID09IHZhbHVlXCJcbiAgICAgICAgW2NsYXNzLnRpZ2h0LXBhZGRpbmddPVwic2VnbWVudFBhZGRpbmcgPT0gJ3RpZ2h0J1wiXG4gICAgICAgIFt0aXRsZV09XCJ0b29sdGlwRXhwciAmJiBpdGVtW3Rvb2x0aXBFeHByXSA/IGl0ZW1bdG9vbHRpcEV4cHJdIDogJydcIlxuICAgICAgICAoY2xpY2spPVwic2VsZWN0SXRlbShpdGVtLCAkZXZlbnQpXCI+XG5cbiAgICAgICAgPGRpdiBjbGFzcz1cInNkcy1mbGV4LXJvdy1jZW50ZXIgZ2FwLTJcIj5cbiAgICAgICAgICAgIDxmYS1pY29uICpuZ0lmPVwiaWNvbkV4cHIgJiYgaXRlbVtpY29uRXhwcl1cIiBbaWNvbl09XCJpdGVtW2ljb25FeHByXVwiIFtmaXhlZFdpZHRoXT1cInRydWVcIj48L2ZhLWljb24+XG4gICAgICAgICAgICA8c3BhbiAqbmdJZj1cImRpc3BsYXlFeHByXCI+e3tpdGVtW2Rpc3BsYXlFeHByXX19PC9zcGFuPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cblxuICAgIDxkaXYgKm5nSWY9XCJlbmFibGVBbmltYXRpb25cIiBcbiAgICAgICAgIGNsYXNzPVwic2RzLWNsaXAtcGF0aC1vdmVybGF5XCIgXG4gICAgICAgICAjY2xpcFBhdGhDb250YWluZXIgXG4gICAgICAgICBhcmlhLWhpZGRlbj1cInRydWVcIj5cbiAgICAgICAgPGRpdiAqbmdGb3I9XCJsZXQgaXRlbSBvZiBpdGVtczsgbGV0IGxhc3QgPSBsYXN0O1wiIFxuICAgICAgICAgICAgY2xhc3M9XCJzZWdtZW50IHNlZ21lbnQtb3ZlcmxheVwiIFxuICAgICAgICAgICAgW2NsYXNzLnRpZ2h0LXBhZGRpbmddPVwic2VnbWVudFBhZGRpbmcgPT0gJ3RpZ2h0J1wiXG4gICAgICAgICAgICBbdGFiSW5kZXhdPVwiLTFcIj5cblxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNkcy1mbGV4LXJvdy1jZW50ZXIgZ2FwLTJcIj5cbiAgICAgICAgICAgICAgICA8ZmEtaWNvbiAqbmdJZj1cImljb25FeHByICYmIGl0ZW1baWNvbkV4cHJdXCIgW2ljb25dPVwiaXRlbVtpY29uRXhwcl1cIiBbZml4ZWRXaWR0aF09XCJ0cnVlXCI+PC9mYS1pY29uPlxuICAgICAgICAgICAgICAgIDxzcGFuICpuZ0lmPVwiZGlzcGxheUV4cHJcIj57e2l0ZW1bZGlzcGxheUV4cHJdfX08L3NwYW4+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUVILHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUVULFlBQVksRUFDWixRQUFRLEVBQ1IsS0FBSyxFQUdMLE1BQU0sRUFFTixTQUFTLEVBQ1QsTUFBTSxFQUNOLEtBQUssRUFDTCxTQUFTLEdBQ1osTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNwRixPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFDbkUsT0FBTyxFQUFFLE9BQU8sRUFBRSxLQUFLLEVBQUUsSUFBSSxFQUFFLE1BQU0saUJBQWlCLENBQUM7O0FBc0J2RCxNQUFNLE9BQU8sNEJBQTRCO0lBcEJ6QztRQXVCSSx1QkFBdUI7UUFDZixTQUFJLEdBQUcsTUFBTSxDQUFDLGlCQUFpQixDQUFDLENBQUM7UUFDakMsY0FBUyxHQUFHLE1BQU0sQ0FBQyxRQUFRLENBQUMsQ0FBQztRQU01QixjQUFTLEdBQUcsT0FBTyxDQUFDO1FBQ3BCLGdCQUFXLEdBQXVCLE1BQU0sQ0FBQztRQUl6QyxhQUFRLEdBQVksS0FBSyxDQUFDO1FBQzFCLFVBQUssR0FBdUMsU0FBUyxDQUFDO1FBQ3RELG1CQUFjLEdBQXNCLE9BQU8sQ0FBQztRQUM1QyxvQkFBZSxH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b3J0IHtcbiAgICBBZnRlclZpZXdJbml0LFxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENoYW5nZURldGVjdG9yUmVmLFxuICAgIENvbXBvbmVudCxcbiAgICBFbGVtZW50UmVmLFxuICAgIEV2ZW50RW1pdHRlcixcbiAgICBJbmplY3RvcixcbiAgICBJbnB1dCxcbiAgICBPbkNoYW5nZXMsXG4gICAgT25Jbml0LFxuICAgIE91dHB1dCxcbiAgICBTaW1wbGVDaGFuZ2VzLFxuICAgIFZpZXdDaGlsZCxcbiAgICBpbmplY3QsXG4gICAgaW5wdXQsXG4gICAgdmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBOR19WQUxVRV9BQ0NFU1NPUiwgTmdDb250cm9sIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgRmFJY29uQ29tcG9uZW50IH0gZnJvbSAnQGZvcnRhd2Vzb21lL2FuZ3VsYXItZm9udGF3ZXNvbWUnO1xuaW1wb3J0IHsgTmdDbGFzcywgTmdGb3IsIE5nSWYgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ3Nkcy1zZWdtZW50ZWQtY29udHJvbCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL3NlZ21lbnRlZC1jb250cm9sLmNvbXBvbmVudC5odG1sJyxcbiAgICBzdHlsZVVybHM6IFsnLi9zZWdtZW50ZWQtY29udHJvbC5jb21wb25lbnQuc2NzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIHN0YW5kYWxvbmU6IHRydWUsXG4gICAgaW1wb3J0czogW1xuICAgICAgICBOZ0NsYXNzLFxuICAgICAgICBOZ0ZvcixcbiAgICAgICAgTmdJZixcbiAgICAgICAgRmFJY29uQ29tcG9uZW50LFxuICAgIF0sXG4gICAgcHJvdmlkZXJzOiBbXG4gICAgICAgIHtcbiAgICAgICAgICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgICAgICAgICAgdXNlRXhpc3Rpbmc6IFNkc1NlZ21lbnRlZENvbnRyb2xDb21wb25lbnQsXG4gICAgICAgICAgICBtdWx0aTogdHJ1ZSxcbiAgICAgICAgfSxcbiAgICBdLFxufSlcbmV4cG9ydCBjbGFzcyBTZHNTZWdtZW50ZWRDb250cm9sQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBBZnRlclZpZXdJbml0LCBPbkNoYW5nZXMsIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcblxuXG4gICAgLy8gI3JlZ2lvbiBEZXBlbmRlbmNpZXNcbiAgICBwcml2YXRlIF9jZHIgPSBpbmplY3QoQ2hhbmdlRGV0ZWN0b3JSZWYpO1xuICAgIHByaXZhdGUgX2luamVjdG9yID0gaW5qZWN0KEluamVjdG9yKTtcbiAgICAvLyAjZW5kcmVnaW9uIERlcGVuZGVuY2llc1xuXG4gICAgLy8gI3JlZ2lvbiBJbnB1dHNcbiAgICBASW5wdXQoKSBpdGVtczogYW55W10gfCB1bmRlZmluZWQ7XG4gICAgQElucHV0KCkgdmFsdWU6IGFueTtcbiAgICBASW5wdXQoKSB2YWx1ZUV4cHIgPSAndmFsdWUnO1xuICAgIEBJbnB1dCgpIGRpc3BsYXlFeHByOiBzdHJpbmcgfCB1bmRlZmluZWQgPSAndGV4dCc7XG4gICAgQElucHV0KCkgaWNvbkV4cHI6IHN0cmluZyB8IHVuZGVmaW5lZDtcbiAgICBASW5wdXQoKSB0b29sdGlwRXhwcjogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICAgIEBJbnB1dCgpIGlkRXhwcjogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICAgIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XG4gICAgQElucHV0KCkgc3R5bGU6ICdkZWZhdWx0JyB8ICdwcmltYXJ5JyB8ICdpbnZlcnRlZCcgPSAnZGVmYXVsdCc7XG4gICAgQElucHV0KCkgc2VnbWVudFBhZGRpbmc6ICd0aWdodCcgfCAnbG9vc2UnID0gJ2xvb3NlJztcbiAgICBASW5wdXQoKSBlbmFibGVBbmltYXRpb246IGJvb2xlYW4gPSB0cnVlO1xuICAgIHB1YmxpYyBhcmlhTGFiZWwgPSBpbnB1dDxzdHJpbmcgfCB1bmRlZmluZWQ+KCk7XG4gICAgLy8gI2VuZHJlZ2lvbiBJbnB1dHNcblxuICAgIC8vICNyZWdpb24gT3V0cHV0c1xuICAgIEBPdXRwdXQoKSBpdGVtQ2hhbmdlOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcbiAgICBAT3V0cHV0KCkgdmFsdWVDaGFuZ2U6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICAgIC8vICNlbmRyZWdpb24gT3V0cHV0c1xuXG4gICAgLy8gI3JlZ2lvbiBET00gcmVmZXJlbmNlc1xuICAgIEBWaWV3Q2hpbGQoJ2NsaXBQYXRoQ29udGFpbmVyJykgY2xpcFBhdGhDb250YWluZXJSZWYhOiBFbGVtZW50UmVmPEhUTUxEaXZFbGVtZW50PjtcbiAgICBwcm90ZWN0ZWQgY29udGFpbmVyUmVmID0gdmlld0NoaWxkPEVsZW1lbnRSZWY8SFRNTERpdkVsZW1lbnQ+PignY29udGFpbmVyUmVmJyk7XG4gICAgLy8gI2VuZHJlZ2lvbiBET00gcmVmZXJlbmNlc1xuXG4gICAgLy8gI3JlZ2lvbiBDb250cm9sVmFsdWVBY2Nlc3NvciBwcml2YXRlIHN0YXRlXG4gICAgcHJpdmF0ZSBfbmdDb250cm9sOiBOZ0NvbnRyb2wgfCBudWxsID0gbnVsbDtcbiAgICBwcml2YXRlIF9vbkNoYW5nZTogKHZhbHVlOiBhbnkpID0+IHZvaWQgPSAoKSA9PiB7fTtcbiAgICBwcml2YXRlIF9vblRvdWNoZWQ6ICgpID0+IHZvaWQgPSAoKSA9PiB7fTtcbiAgICAvLyAjZW5kcmVnaW9uIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHByaXZhdGUgc3RhdGVcblxuICAgIG5nT25Jbml0KCkge1xuICAgICAgICAvKipcbiAgICAgICAgICogRG9uJ3QgaW5qZWN0IG5nQ29udHJvbCBhdCB0aGUgY29uc3RydWN0b3IsIGJlY2F1c2UgaXQgY2F1c2VzIEN5Y2xpYyBEZXBlbmRlbmN5LlxuICAgICAgICAgKiBXZSBjYW4gaW5qZWN0IGl0IHZpYSBJbmplY3RvciB0byBhdm9pZCB0aGUgZXJyb3IuXG4gICAgICAgICAqL1xuICAgICAgICB0aGlzLl9uZ0NvbnRyb2wgPSB0aGlzLl9pbmplY3Rvci5nZXQoTmdDb250cm9sLCBudWxsKTtcblxuICAgICAgICBpZiAodGhpcy5fbmdDb250cm9sICE9PSBudWxsKSB7XG4gICAgICAgICAgICB0aGlzLl9uZ0NvbnRyb2wudmFsdWVBY2Nlc3NvciA9IHRoaXM7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgICAgIGlmICh0aGlzLmVuYWJsZUFuaW1hdGlvbikge1xuICAgICAgICAgICAgdGhpcy51cGRhdGVDbGlwUGF0aCgpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcykge1xuICAgICAgICBpZiAoKGNoYW5nZXNbJ3ZhbHVlJ10gfHwgY2hhbmdlc1snZW5hYmxlQ2xpcFBhdGhBbmltYXRpb24nXSkgJiYgdGhpcy5lbmFibGVBbmltYXRpb24pIHtcbiAgICAgICAgICAgIC8vIFVzZSBhIGxvbmdlciB0aW1lb3V0IHRvIGVuc3VyZSB0aGUgRE9NIGlzIHVwZGF0ZWRcbiAgICAgICAgICAgIHNldFRpbWVvdXQoKCkgPT4gdGhpcy51cGRhdGVDbGlwUGF0aCgpLCA1MCk7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICAvLyAjcmVnaW9uIENvbnRyb2xWYWx1ZUFjY2Vzc29yIGltcGxlbWVudGF0aW9uXG4gICAgcHVibGljIHdyaXRlVmFsdWUodmFsdWU6IGFueSk6IHZvaWQge1xuICAgICAgICBpZiAodmFsdWUgIT09IHVuZGVmaW5lZCAmJiB2YWx1ZSAhPT0gbnVsbCkge1xuICAgICAgICAgICAgdGhpcy52YWx1ZSA9IHZhbHVlO1xuICAgICAgICAgICAgdGhpcy5fY2RyLm1hcmtGb3JDaGVjaygpO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgcHVibGljIHJlZ2lzdGVyT25DaGFuZ2UoZm46ICh2YWx1ZTogYW55KSA9PiB2b2lkKTogdm9pZCB7XG4gICAgICAgIHRoaXMuX29uQ2hhbmdlID0gZm47XG4gICAgfVxuXG4gICAgcHVibGljIHJlZ2lzdGVyT25Ub3VjaGVkKGZuOiAoKSA9PiB2b2lkKTogdm9pZCB7XG4gICAgICAgIHRoaXMuX29uVG91Y2hlZCA9IGZuO1xuICAgIH1cblxuICAgIHB1YmxpYyBzZXREaXNhYmxlZFN0YXRlKGlzRGlzYWJsZWQ6IGJvb2xlYW4pOiB2b2lkIHtcbiAgICAgICAgdGhpcy5kaXNhYmxlZCA9IGlzRGlzYWJsZWQ7XG4gICAgICAgIHRoaXMuX2Nkci5tYXJrRm9yQ2hlY2soKTtcbiAgICB9XG4gICAgLy8gI2VuZHJlZ2lvbiBDb250cm9sVmFsdWVBY2Nlc3NvciBpbXBsZW1lbnRhdGlvblxuXG4gICAgcHVibGljIHNlbGVjdEl0ZW0oaXRlbTogYW55LCBldmVudDogTW91c2VFdmVudCk6IHZvaWQge1xuICAgICAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcblxuICAgICAgICBpZiAoIXRoaXMuZGlzYWJsZWQpIHtcbiAgICAgICAgICAgIHRoaXMudmFsdWUgPSBpdGVtW3RoaXMudmFsdWVFeHByXTtcbiAgICAgICAgICAgIHRoaXMudmFsdWVDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcbiAgICAgICAgICAgIHRoaXMuaXRlbUNoYW5nZS5lbWl0KGl0ZW0pO1xuXG4gICAgICAgICAgICAvLyBOb3RpZnkgZm9ybSBjb250cm9sIGlmIGluIGZvcm0gY29udGV4dFxuICAgICAgICAgICAgaWYgKHRoaXMuX25nQ29udHJvbCkge1xuICAgICAgICAgICAgICAgIHRoaXMuX29uQ2hhbmdlKHRoaXMudmFsdWUpO1xuICAgICAgICAgICAgICAgIHRoaXMuX29uVG91Y2hlZCgpO1xuICAgICAgICAgICAgfVxuXG4gICAgICAgICAgICBpZiAodGhpcy5lbmFibGVBbmltYXRpb24pIHtcbiAgICAgICAgICAgICAgICB0aGlzLl9jZHIuZGV0ZWN0Q2hhbmdlcygpO1xuICAgICAgICAgICAgICAgIHRoaXMudXBkYXRlQ2xpcFBhdGgoKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH1cblxuICAgIHB1YmxpYyBvblNlZ21lbnRLZXlkb3duKGV2ZW50OiBLZXlib2FyZEV2ZW50LCBpdGVtOiBhbnkpOiB2b2lkIHtcbiAgICAgICAgaWYgKHRoaXMuZGlzYWJsZWQpIHtcbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfVxuXG4gICAgICAgIGNvbnN0IGN1cnJlbnRJbmRleCA9IHRoaXMuZ2V0SXRlbUluZGV4KGl0ZW0pO1xuICAgICAgICBsZXQgbmV4dEluZGV4OiBudW1iZXIgfCBudWxsID0gbnVsbDtcblxuICAgICAgICBzd2l0Y2ggKGV2ZW50LmtleSkge1xuICAgICAgICAgICAgY2FzZSAnQXJyb3dMZWZ0JzpcbiAgICAgICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgICAgICAgIG5leHRJbmRleCA9IGN1cnJlbnRJbmRleCA+IDAgPyBjdXJyZW50SW5kZXggLSAxIDogKHRoaXMuaXRlbXM/Lmxlbmd0aCA/PyAxKSAtIDE7XG4gICAgICAgICAgICAgICAgYnJlYWs7XG4gICAgICAgICAgICBjYXNlICdBcnJvd1JpZ2h0JzpcbiAgICAgICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgICAgICAgIG5leHRJbmRleCA9IGN1cnJlbnRJbmRleCA8ICh0aGlzLml0ZW1zPy5sZW5ndGggPz8gMSkgLSAxID8gY3VycmVudEluZGV4ICsgMSA6IDA7XG4gICAgICAgICAgICAgICAgYnJlYWs7XG4gICAgICAgICAgICBjYXNlICdIb21lJzpcbiAgICAgICAgICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgICAgICAgICAgIG5leHRJbmRleCA9IDA7XG4gICAgICAgICAgICAgICAgYnJlYWs7XG4gICAgICAgICAgICBjYXNlICdFbmQnOlxuICAgICAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgICAgICAgbmV4dEluZGV4ID0gKHRoaXMuaXRlbXM/Lmxlbmd0aCA/PyAxKSAtIDE7XG4gICAgICAgICAgICAgICAgYnJlYWs7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAobmV4dEluZGV4ICE9PSBudWxsICYmIHRoaXMuaXRlbXMpIHtcbiAgICAgICAgICAgIHRoaXMubmF2aWdhdGVUb0l0ZW0obmV4dEluZGV4KTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIHB1YmxpYyBnZXRTZWdtZW50QXJpYUxhYmVsKGl0ZW06IGFueSwgaW5kZXg6IG51bWJlcik6IHN0cmluZyB8IG51bGwge1xuICAgICAgICAvLyBPbmx5IHNldCBhbiBleHBsaWNpdCBhcmlhLWxhYmVsIHdoZW4gdmlzaWJsZSB0ZXh0IGlzIGludGVudGlvbmFsbHkgb21pdHRlZC5cbiAgICAgICAgaWYgKHRoaXMuZGlzcGxheUV4cHIpIHtcbiAgICAgICAgICAgIHJldHVybiBudWxsO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKHRoaXMudG9vbHRpcEV4cHIgJiYgaXRlbT8uW3RoaXMudG9vbHRpcEV4cHJdKSB7XG4gICAgICAgICAgICByZXR1cm4gU3RyaW5nKGl0ZW1bdGhpcy50b29sdGlwRXhwcl0pO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKGl0ZW0/Llt0aGlzLnZhbHVlRXhwcl0gIT09IHVuZGVmaW5lZCAmJiBpdGVtPy5bdGhpcy52YWx1ZUV4cHJdICE9PSBudWxsKSB7XG4gICAgICAgICAgICByZXR1cm4gU3RyaW5nKGl0ZW1bdGhpcy52YWx1ZUV4cHJdKTtcbiAgICAgICAgfVxuXG4gICAgICAgIHJldHVybiBgU2VnbWVudCBvcHRpb24gJHtpbmRleCArIDF9YDtcbiAgICB9XG5cbiAgICBwcml2YXRlIGdldEl0ZW1JbmRleChpdGVtOiBhbnkpOiBudW1iZXIge1xuICAgICAgICByZXR1cm4gdGhpcy5pdGVtcz8uaW5kZXhPZihpdGVtKSA/PyAtMTtcbiAgICB9XG5cbiAgICBwcml2YXRlIG5hdmlnYXRlVG9JdGVtKGluZGV4OiBudW1iZXIpOiB2b2lkIHtcbiAgICAgICAgaWYgKCF0aGlzLml0ZW1zIHx8IGluZGV4IDwgMCB8fCBpbmRleCA+PSB0aGlzLml0ZW1zLmxlbmd0aCkge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG5cbiAgICAgICAgY29uc3QgaXRlbSA9IHRoaXMuaXRlbXNbaW5kZXhdO1xuICAgICAgICB0aGlzLnZhbHVlID0gaXRlbVt0aGlzLnZhbHVlRXhwcl07XG4gICAgICAgIHRoaXMudmFsdWVDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcbiAgICAgICAgdGhpcy5pdGVtQ2hhbmdlLmVtaXQoaXRlbSk7XG5cbiAgICAgICAgLy8gTm90aWZ5IGZvcm0gY29udHJvbCBpZiBpbiBmb3JtIGNvbnRleHRcbiAgICAgICAgaWYgKHRoaXMuX25nQ29udHJvbCkge1xuICAgICAgICAgICAgdGhpcy5fb25DaGFuZ2UodGhpcy52YWx1ZSk7XG4gICAgICAgICAgICB0aGlzLl9vblRvdWNoZWQoKTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmICh0aGlzLmVuYWJsZUFuaW1hdGlvbikge1xuICAgICAgICAgICAgdGhpcy5fY2RyLmRldGVjdENoYW5nZXMoKTtcbiAgICAgICAgICAgIHRoaXMudXBkYXRlQ2xpcFBhdGgoKTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIEZvY3VzIHRoZSBzZWdtZW50IGVsZW1lbnQgYWZ0ZXIgY2hhbmdlIGRldGVjdGlvblxuICAgICAgICB0aGlzLmZvY3VzU2VnbWVudEVsZW1lbnQoaW5kZXgpO1xuICAgIH1cblxuICAgIHByaXZhdGUgZm9jdXNTZWdtZW50RWxlbWVudChpbmRleDogbnVtYmVyKTogdm9pZCB7XG4gICAgICAgIC8vIFVzZSBzZXRUaW1lb3V0IHRvIGVuc3VyZSBET00gaXMgdXBkYXRlZCBiZWZvcmUgZm9jdXNpbmdcbiAgICAgICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgICAgICBjb25zdCBzZWdtZW50RWxlbWVudHMgPSB0aGlzLmNvbnRhaW5lclJlZigpPy5uYXRpdmVFbGVtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoJy5zZWdtZW50Om5vdCguc2VnbWVudC1vdmVybGF5KScpO1xuICAgICAgICAgICAgaWYgKHNlZ21lbnRFbGVtZW50cyAmJiBzZWdtZW50RWxlbWVudHNbaW5kZXhdKSB7XG4gICAgICAgICAgICAgICAgKHNlZ21lbnRFbGVtZW50c1tpbmRleF0gYXMgSFRNTEVsZW1lbnQpLmZvY3VzKCk7XG4gICAgICAgICAgICB9XG4gICAgICAgIH0sIDApO1xuICAgIH1cblxuICAgIHByaXZhdGUgdXBkYXRlQ2xpcFBhdGgoKSB7XG4gICAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgICAgY29uc3QgY29udGFpbmVyID0gdGhpcy5jbGlwUGF0aENvbnRhaW5lclJlZj8ubmF0aXZlRWxlbWVudDtcbiAgICAgICAgICAgIGlmICghY29udGFpbmVyKSByZXR1cm47XG5cbiAgICAgICAgICAgIGNvbnN0IGFjdGl2ZVNlZ21lbnQgPSBjb250YWluZXIucGFyZW50RWxlbWVudD8ucXVlcnlTZWxlY3RvcihcbiAgICAgICAgICAgICAgICBgLnNlZ21lbnQuc2VsZWN0ZWQ6bm90KC5zZWdtZW50LW92ZXJsYXkpYFxuICAgICAgICAgICAgKSBhcyBIVE1MRWxlbWVudDtcblxuICAgICAgICAgICAgaWYgKGFjdGl2ZVNlZ21lbnQgJiYgY29udGFpbmVyLnBhcmVudEVsZW1lbnQpIHtcbiAgICAgICAgICAgICAgICBjb25zdCBwYXJlbnRFbGVtZW50ID0gY29udGFpbmVyLnBhcmVudEVsZW1lbnQ7XG5cbiAgICAgICAgICAgICAgICBjb25zdCBjb21wdXRlZFN0eWxlID0gd2luZG93LmdldENvbXB1dGVkU3R5bGUocGFyZW50RWxlbWVudCk7XG4gICAgICAgICAgICAgICAgY29uc3QgcGFkZGluZ0xlZnQgPSBwYXJzZUZsb2F0KGNvbXB1dGVkU3R5bGUucGFkZGluZ0xlZnQpO1xuXG4gICAgICAgICAgICAgICAgY29uc3Qgb2Zmc2V0TGVmdCA9IGFjdGl2ZVNlZ21lbnQub2Zmc2V0TGVmdCAtIHBhZGRpbmdMZWZ0O1xuICAgICAgICAgICAgICAgIGNvbnN0IG9mZnNldFdpZHRoID0gYWN0aXZlU2VnbWVudC5vZmZzZXRXaWR0aDtcbiAgICAgICAgICAgICAgICBjb25zdCBvdmVybGF5V2lkdGggPSBjb250YWluZXIub2Zmc2V0V2lkdGg7XG5cbiAgICAgICAgICAgICAgICAvLyBPbmx5IHVwZGF0ZSBpZiB3ZSBoYXZlIHZhbGlkIGRpbWVuc2lvbnNcbiAgICAgICAgICAgICAgICBpZiAob2Zmc2V0V2lkdGggPT09IDAgfHwgb3ZlcmxheVdpZHRoID09PSAwKSB7XG4gICAgICAgICAgICAgICAgICAgIC8vIFJldHJ5IGFmdGVyIGEgc2hvcnQgZGVsYXkgaWYgZWxlbWVudHMgYXJlbid0IHJlbmRlcmVkIHlldFxuICAgICAgICAgICAgICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHRoaXMudXBkYXRlQ2xpcFBhdGgoKSwgMTAwKTtcbiAgICAgICAgICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgICAgIGNvbnN0IGNsaXBMZWZ0ID0gb2Zmc2V0TGVmdDtcbiAgICAgICAgICAgICAgICBjb25zdCBjbGlwUmlnaHQgPSBvZmZzZXRMZWZ0ICsgb2Zmc2V0V2lkdGg7XG5cbiAgICAgICAgICAgICAgICBjb25zdCBjbGlwTGVmdFBlcmNlbnQgPSAoKGNsaXBMZWZ0IC8gb3ZlcmxheVdpZHRoKSAqIDEwMCkudG9GaXhlZCgyKTtcbiAgICAgICAgICAgICAgICBjb25zdCBjbGlwUmlnaHRQZXJjZW50ID0gKDEwMCAtIChjbGlwUmlnaHQgLyBvdmVybGF5V2lkdGgpICogMTAwKS50b0ZpeGVkKDIpO1xuXG4gICAgICAgICAgICAgICAgY29udGFpbmVyLnN0eWxlLmNsaXBQYXRoID0gYGluc2V0KDAgJHtjbGlwUmlnaHRQZXJjZW50fSUgMCAke2NsaXBMZWZ0UGVyY2VudH0lIHJvdW5kIDRweClgO1xuICAgICAgICAgICAgfVxuICAgICAgICB9LCAwKTtcbiAgICB9XG59XG4iLCI8ZGl2XG4gICAgI2NvbnRhaW5lclJlZlxuICAgIGNsYXNzPVwic2RzLXNlZ21lbnRlZC1jb250cm9sLWNvbnRhaW5lclwiXG4gICAgcm9sZT1cImdyb3VwXCJcbiAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImFyaWFMYWJlbCgpIHx8ICdTZWdtZW50ZWQgY29udHJvbCdcIlxuICAgIFtuZ0NsYXNzXT1cIntcbiAgICAgICAgJ2Rpc2FibGVkJzogZGlzYWJsZWQsXG4gICAgICAgICdzZHMtc2VnbWVudGVkLWNvbnRyb2wtcHJpbWFyeSc6IHN0eWxlID09ICdwcmltYXJ5JyxcbiAgICAgICAgJ3Nkcy1zZWdtZW50ZWQtY29udHJvbC1pbnZlcnRlZCc6IHN0eWxlID09ICdpbnZlcnRlZCcsXG4gICAgICAgICdjbGlwLXBhdGgtZW5hYmxlZCc6IGVuYWJsZUFuaW1hdGlvblxuICAgIH1cIj5cblxuICAgIDxkaXYgKm5nRm9yPVwibGV0IGl0ZW0gb2YgaXRlbXM7IGxldCBpbmRleCA9IGluZGV4OyBsZXQgbGFzdCA9IGxhc3Q7XCJcbiAgICAgICAgY2xhc3M9XCJzZWdtZW50XCJcbiAgICAgICAgaWQ9XCJ7e2lkRXhwciA/IGl0ZW1baWRFeHByXTogJyd9fVwiXG4gICAgICAgIHJvbGU9XCJidXR0b25cIlxuICAgICAgICBbdGFiaW5kZXhdPVwiaXRlbVt2YWx1ZUV4cHJdID09PSB2YWx1ZSA/IDAgOiAtMVwiXG4gICAgICAgIFthdHRyLmFyaWEtbGFiZWxdPVwiZ2V0U2VnbWVudEFyaWFMYWJlbChpdGVtLCBpbmRleClcIlxuICAgICAgICBbYXR0ci5hcmlhLXByZXNzZWRdPVwiaXRlbVt2YWx1ZUV4cHJdID09PSB2YWx1ZVwiXG4gICAgICAgIFtjbGFzcy5zZWxlY3RlZF09XCJpdGVtW3ZhbHVlRXhwcl0gPT0gdmFsdWVcIlxuICAgICAgICBbY2xhc3MudGlnaHQtcGFkZGluZ109XCJzZWdtZW50UGFkZGluZyA9PSAndGlnaHQnXCJcbiAgICAgICAgW3RpdGxlXT1cInRvb2x0aXBFeHByICYmIGl0ZW1bdG9vbHRpcEV4cHJdID8gaXRlbVt0b29sdGlwRXhwcl0gOiAnJ1wiXG4gICAgICAgIChjbGljayk9XCJzZWxlY3RJdGVtKGl0ZW0sICRldmVudClcIlxuICAgICAgICAoa2V5ZG93bik9XCJvblNlZ21lbnRLZXlkb3duKCRldmVudCwgaXRlbSlcIj5cblxuICAgICAgICA8ZGl2IGNsYXNzPVwic2RzLWZsZXgtcm93LWNlbnRlciBnYXAtMlwiPlxuICAgICAgICAgICAgPGZhLWljb24gKm5nSWY9XCJpY29uRXhwciAmJiBpdGVtW2ljb25FeHByXVwiIFtpY29uXT1cIml0ZW1baWNvbkV4cHJdXCIgW2ZpeGVkV2lkdGhdPVwidHJ1ZVwiPjwvZmEtaWNvbj5cbiAgICAgICAgICAgIDxzcGFuICpuZ0lmPVwiZGlzcGxheUV4cHJcIj57e2l0ZW1bZGlzcGxheUV4cHJdfX08L3NwYW4+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdiAqbmdJZj1cImVuYWJsZUFuaW1hdGlvblwiXG4gICAgICAgICBjbGFzcz1cInNkcy1jbGlwLXBhdGgtb3ZlcmxheVwiXG4gICAgICAgICAjY2xpcFBhdGhDb250YWluZXJcbiAgICAgICAgIGFyaWEtaGlkZGVuPVwidHJ1ZVwiPlxuICAgICAgICA8ZGl2ICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zOyBsZXQgbGFzdCA9IGxhc3Q7XCJcbiAgICAgICAgICAgIGNsYXNzPVwic2VnbWVudCBzZWdtZW50LW92ZXJsYXlcIlxuICAgICAgICAgICAgW2NsYXNzLnRpZ2h0LXBhZGRpbmddPVwic2VnbWVudFBhZGRpbmcgPT0gJ3RpZ2h0J1wiXG4gICAgICAgICAgICBbdGFiSW5kZXhdPVwiLTFcIj5cblxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNkcy1mbGV4LXJvdy1jZW50ZXIgZ2FwLTJcIj5cbiAgICAgICAgICAgICAgICA8ZmEtaWNvbiAqbmdJZj1cImljb25FeHByICYmIGl0ZW1baWNvbkV4cHJdXCIgW2ljb25dPVwiaXRlbVtpY29uRXhwcl1cIiBbZml4ZWRXaWR0aF09XCJ0cnVlXCI+PC9mYS1pY29uPlxuICAgICAgICAgICAgICAgIDxzcGFuICpuZ0lmPVwiZGlzcGxheUV4cHJcIj57e2l0ZW1bZGlzcGxheUV4cHJdfX08L3NwYW4+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==

package/fesm2022/spicainternational-ngx-sds-components-src-lib-app-switcher.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-app-switcher.mjs","sources":["../../../projects/ngx-sds-components/src/lib/app-switcher/app-switcher.component.ts","../../../projects/ngx-sds-components/src/lib/app-switcher/app-switcher.component.html","../../../projects/ngx-sds-components/src/lib/app-switcher/spicainternational-ngx-sds-components-src-lib-app-switcher.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Inject, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\nimport { DxPopoverComponent } from 'devextreme-angular';\n\nimport { ProductModel } from './app-switcher.model';\nimport { fromEvent, groupBy, mergeAll, Subscription } from 'rxjs';\nimport { DOCUMENT } from '@angular/common';\nimport { NgIf, NgFor, NgTemplateOutlet } from '@angular/common';\nimport { DxScrollViewModule } from 'devextreme-angular/ui/scroll-view';\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\nimport { CdkTrapFocus } from '@angular/cdk/a11y';\n\n@Component({\n    selector: 'sds-app-switcher',\n    templateUrl: './app-switcher.component.html',\n    styleUrls: ['./app-switcher.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [\n        NgIf, \n        NgFor, \n\n        CdkTrapFocus, \n        \n        DxPopoverModule, \n        DxScrollViewModule, \n        NgTemplateOutlet\n    ]\n})\nexport class SdsAppSwitcherComponent implements OnInit, OnChanges, OnDestroy {\n    @ViewChild('popover', {static: false}) private popover?: DxPopoverComponent;\n\n    @Input() public productCode: Number | undefined;\n    @Input() public userProductCodes: Number[] | undefined;\n    @Input() public tenantProducts: ProductModel[] | undefined;\n    @Input() public switchText: string = '';\n    @Input() public discoverText: string = '';\n\n    /**\n     * @description\n     * Aria label appended to native button element. Defaults to 'Switch between apps'\n     */\n    @Input() public ariaLabel: string = 'Switch between apps'\n\n    @Output() public productClick: EventEmitter<ProductModel> = new EventEmitter();\n\n\n    public activatedProducts: ProductModel[];\n    public discoverProducts: ProductModel[];\n\n    public showSkeleton: boolean;\n\n    public elementUUID = 'sds-as-' + crypto.randomUUID();\n    public showDropdown = false;\n\n    private _subscriptions: Subscription[] = [];\n\n    constructor(@Inject(DOCUMENT) private readonly _document: Document) {\n        this.showSkeleton = true;\n        this.activatedProducts = new Array<ProductModel>();\n        this.discoverProducts = new Array<ProductModel>();\n    }\n\n    ngOnInit(): void {\n        const keyboardEventsSubscription = fromEvent<KeyboardEvent>(\n            this._document,\n              'keydown'\n            )\n            .pipe(\n                groupBy((e: KeyboardEvent) => e.code),\n                mergeAll()\n            )\n            .subscribe((keyboardEvent:KeyboardEvent) => {\n                if (keyboardEvent.code === 'Escape') {\n                  this.onCloseDropdownPressed();\n                }\n\n            });\n\n            this._subscriptions.push(keyboardEventsSubscription);\n    }\n\n    ngOnChanges(changes: SimpleChanges) {\n        if (changes['userProductCodes'] || changes['tenantProducts'] || changes['productCode']) {\n            if (this.userProductCodes !== undefined && this.tenantProducts !== undefined && this.productCode !== undefined) {\n                this.activatedProducts = [];\n                this.discoverProducts = [];\n\n                this.tenantProducts.forEach(product => {\n                    if ((this.userProductCodes as Number[]).includes(product.code)) {\n                        // exclude current product from the list\n                        if (product.code != this.productCode) {\n                            this.activatedProducts.push(product);\n                        }\n                    } else {\n                        this.discoverProducts.push(product);\n                    }\n                });\n                this.showSkeleton = false;\n            } else {\n                this.showSkeleton = true;\n            }\n            this.popover?.instance.repaint();\n        }\n    }\n\n    ngOnDestroy(): void {\n\n    }\n\n    public emitProductClick(product: ProductModel): void {\n        this.productClick.emit(product);\n    }\n\n    public onCloseDropdownPressed(): void {\n        if (this.showDropdown) {\n            this.showDropdown = false;\n            this.popover?.instance.hide();\n        }\n    }\n\n    public onDropdownClicked(){\n        this.showDropdown = !this.showDropdown;\n    }\n\n    public onProductKeyReleased(event: KeyboardEvent, product: ProductModel) {\n        if (event.key === 'Enter') {\n            this.productClick.emit(product)\n        }\n    }\n\n}\n","<ng-template #productTemplate let-product=\"product\">\n    <div class=\"product-logo\">\n        <img [src]=\"product.logoUri\" alt=\"{{ product.Name }}\">\n    </div>\n    <div class=\"product-title d-flex align-items-center\">\n        {{product.name}}\n    </div>\n    <div class=\"product-description\">\n        {{product.description}}\n    </div>\n</ng-template>\n\n<div\n    sdsKeyboardShortcut\n    #popoverTarget\n    class=\"btn-group app-switcher\"\n    >\n    <button\n        type=\"button\"\n        tabindex=\"0\"\n        class=\"btn btn-link rounded p-0 text-gray-800 switcher-button d-flex align-items-center justify-content-center\"\n        [attr.aria-controls]=\"elementUUID + '_dropdown'\"\n        [attr.aria-label]=\"ariaLabel\"\n        (click)=\"onDropdownClicked()\">\n\n        <svg width=\"0.86rem\" height=\"0.86rem\" xmlns=\"http://www.w3.org/2000/svg\">\n            <!-- Row 1 -->\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0\" y=\"0\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.33rem\" y=\"0\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.66rem\" y=\"0\" fill=\"black\" />\n\n            <!-- Row 2 -->\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0\" y=\"0.33rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.33rem\" y=\"0.33rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.66rem\" y=\"0.33rem\" fill=\"black\" />\n\n            <!-- Row 3 -->\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0\" y=\"0.66rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.33rem\" y=\"0.66rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.66rem\" y=\"0.66rem\" fill=\"black\" />\n        </svg>\n    \n    </button>\n</div>\n\n<dx-popover\n    #popover\n    [target]=\"popoverTarget\"\n    [(visible)]=\"showDropdown\"\n    [wrapperAttr]=\"{ class: 'sds-app-switcher-popover sds-dx-popup-no-arrow' }\"\n    >\n    <dx-scroll-view\n        showScrollbar=\"always\">\n\n        <div cdkTrapFocus class=\"app-switcher-menu\">\n\n            <ng-container *ngIf=\"showSkeleton\">\n                <div class=\"header skeleton skeleton-height-1 w-50 \"></div>\n                <div class=\"product mt-2 skeleton skeleton-height-2\"></div>\n            </ng-container>\n\n            <ng-container *ngIf=\"!showSkeleton && activatedProducts.length > 0\">\n                <h6 class=\"header\">{{ switchText }}</h6>\n                <div *ngFor=\"let activatedProduct of activatedProducts\"\n                    role=\"button\"\n                    tabindex=\"0\"\n                    class=\"product\"\n                    (click)=\"emitProductClick(activatedProduct)\"\n                    (keydown)=\"onProductKeyReleased($event, activatedProduct)\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"productTemplate\"\n                        [ngTemplateOutletContext]=\"{ product: activatedProduct }\">\n                    </ng-container>\n                </div>\n            </ng-container>\n\n            <ng-container *ngIf=\"!showSkeleton && discoverProducts.length > 0\">\n                <h6 class=\"header\">{{ discoverText }}</h6>\n\n                <div *ngFor=\"let discoverProduct of discoverProducts\"\n                role=\"button\"\n                    tabindex=\"0\"\n                    class=\"product\"\n                    (click)=\"emitProductClick(discoverProduct)\"\n                    (keydown)=\"onProductKeyReleased($event, discoverProduct)\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"productTemplate\"\n                        [ngTemplateOutletContext]=\"{ product: discoverProduct }\">\n                    </ng-container>\n                </div>\n            </ng-container>\n        </div>\n    </dx-scroll-view>\n</dx-popover>\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-app-switcher.mjs","sources":["../../../projects/ngx-sds-components/src/lib/app-switcher/app-switcher.component.ts","../../../projects/ngx-sds-components/src/lib/app-switcher/app-switcher.component.html","../../../projects/ngx-sds-components/src/lib/app-switcher/spicainternational-ngx-sds-components-src-lib-app-switcher.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Inject, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';\nimport { DxPopoverComponent } from 'devextreme-angular';\n\nimport { ProductModel } from './app-switcher.model';\nimport { fromEvent, groupBy, mergeAll, Subscription } from 'rxjs';\nimport { DOCUMENT } from '@angular/common';\nimport { NgIf, NgFor, NgTemplateOutlet } from '@angular/common';\nimport { DxScrollViewModule } from 'devextreme-angular/ui/scroll-view';\nimport { DxPopoverModule } from 'devextreme-angular/ui/popover';\nimport { CdkTrapFocus } from '@angular/cdk/a11y';\n\n@Component({\n    selector: 'sds-app-switcher',\n    templateUrl: './app-switcher.component.html',\n    styleUrls: ['./app-switcher.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    standalone: true,\n    imports: [\n        NgIf, \n        NgFor, \n\n        CdkTrapFocus, \n        \n        DxPopoverModule, \n        DxScrollViewModule, \n        NgTemplateOutlet\n    ]\n})\nexport class SdsAppSwitcherComponent implements OnInit, OnChanges, OnDestroy {\n    @ViewChild('popover', {static: false}) private popover?: DxPopoverComponent;\n\n    @Input() public productCode: string | undefined;\n    @Input() public userProductCodes: string[] | undefined;\n    @Input() public tenantProducts: ProductModel[] | undefined;\n    @Input() public switchText: string = '';\n    @Input() public discoverText: string = '';\n\n    /**\n     * @description\n     * Aria label appended to native button element. Defaults to 'Switch between apps'\n     */\n    @Input() public ariaLabel: string = 'Switch between apps'\n\n    @Output() public productClick: EventEmitter<ProductModel> = new EventEmitter();\n\n\n    public activatedProducts: ProductModel[];\n    public discoverProducts: ProductModel[];\n\n    public showSkeleton: boolean;\n\n    public elementUUID = 'sds-as-' + crypto.randomUUID();\n    public showDropdown = false;\n\n    private _subscriptions: Subscription[] = [];\n\n    constructor(@Inject(DOCUMENT) private readonly _document: Document) {\n        this.showSkeleton = true;\n        this.activatedProducts = new Array<ProductModel>();\n        this.discoverProducts = new Array<ProductModel>();\n    }\n\n    ngOnInit(): void {\n        const keyboardEventsSubscription = fromEvent<KeyboardEvent>(\n            this._document,\n              'keydown'\n            )\n            .pipe(\n                groupBy((e: KeyboardEvent) => e.code),\n                mergeAll()\n            )\n            .subscribe((keyboardEvent:KeyboardEvent) => {\n                if (keyboardEvent.code === 'Escape') {\n                  this.onCloseDropdownPressed();\n                }\n\n            });\n\n            this._subscriptions.push(keyboardEventsSubscription);\n    }\n\n    ngOnChanges(changes: SimpleChanges) {\n        if (changes['userProductCodes'] || changes['tenantProducts'] || changes['productCode']) {\n            if (this.userProductCodes !== undefined && this.tenantProducts !== undefined && this.productCode !== undefined) {\n                this.activatedProducts = [];\n                this.discoverProducts = [];\n\n                this.tenantProducts.forEach(product => {\n                    if ((this.userProductCodes as string[]).includes(product.code)) {\n                        // exclude current product from the list\n                        if (product.code != this.productCode) {\n                            this.activatedProducts.push(product);\n                        }\n                    } else {\n                        this.discoverProducts.push(product);\n                    }\n                });\n                this.showSkeleton = false;\n            } else {\n                this.showSkeleton = true;\n            }\n            this.popover?.instance.repaint();\n        }\n    }\n\n    ngOnDestroy(): void {\n\n    }\n\n    public emitProductClick(product: ProductModel): void {\n        this.productClick.emit(product);\n    }\n\n    public onCloseDropdownPressed(): void {\n        if (this.showDropdown) {\n            this.showDropdown = false;\n            this.popover?.instance.hide();\n        }\n    }\n\n    public onDropdownClicked(){\n        this.showDropdown = !this.showDropdown;\n    }\n\n    public onProductKeyReleased(event: KeyboardEvent, product: ProductModel) {\n        if (event.key === 'Enter') {\n            this.productClick.emit(product)\n        }\n    }\n\n}\n","<ng-template #productTemplate let-product=\"product\">\n    <div class=\"product-logo\">\n        <img [src]=\"product.logoUri\" alt=\"{{ product.Name }}\">\n    </div>\n    <div class=\"product-title d-flex align-items-center\">\n        {{product.name}}\n    </div>\n    <div class=\"product-description\">\n        {{product.description}}\n    </div>\n</ng-template>\n\n<div\n    sdsKeyboardShortcut\n    #popoverTarget\n    class=\"btn-group app-switcher\"\n    >\n    <button\n        type=\"button\"\n        tabindex=\"0\"\n        class=\"btn btn-link rounded p-0 text-gray-800 switcher-button d-flex align-items-center justify-content-center\"\n        [attr.aria-controls]=\"elementUUID + '_dropdown'\"\n        [attr.aria-label]=\"ariaLabel\"\n        (click)=\"onDropdownClicked()\">\n\n        <svg width=\"0.86rem\" height=\"0.86rem\" xmlns=\"http://www.w3.org/2000/svg\">\n            <!-- Row 1 -->\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0\" y=\"0\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.33rem\" y=\"0\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.66rem\" y=\"0\" fill=\"black\" />\n\n            <!-- Row 2 -->\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0\" y=\"0.33rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.33rem\" y=\"0.33rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.66rem\" y=\"0.33rem\" fill=\"black\" />\n\n            <!-- Row 3 -->\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0\" y=\"0.66rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.33rem\" y=\"0.66rem\" fill=\"black\" />\n            <rect width=\"0.2rem\" height=\"0.2rem\" x=\"0.66rem\" y=\"0.66rem\" fill=\"black\" />\n        </svg>\n    \n    </button>\n</div>\n\n<dx-popover\n    #popover\n    [target]=\"popoverTarget\"\n    [(visible)]=\"showDropdown\"\n    [wrapperAttr]=\"{ class: 'sds-app-switcher-popover sds-dx-popup-no-arrow' }\"\n    >\n    <dx-scroll-view\n        showScrollbar=\"always\">\n\n        <div cdkTrapFocus class=\"app-switcher-menu\">\n\n            <ng-container *ngIf=\"showSkeleton\">\n                <div class=\"header skeleton skeleton-height-1 w-50 \"></div>\n                <div class=\"product mt-2 skeleton skeleton-height-2\"></div>\n            </ng-container>\n\n            <ng-container *ngIf=\"!showSkeleton && activatedProducts.length > 0\">\n                <h6 class=\"header\">{{ switchText }}</h6>\n                <div *ngFor=\"let activatedProduct of activatedProducts\"\n                    role=\"button\"\n                    tabindex=\"0\"\n                    class=\"product\"\n                    (click)=\"emitProductClick(activatedProduct)\"\n                    (keydown)=\"onProductKeyReleased($event, activatedProduct)\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"productTemplate\"\n                        [ngTemplateOutletContext]=\"{ product: activatedProduct }\">\n                    </ng-container>\n                </div>\n            </ng-container>\n\n            <ng-container *ngIf=\"!showSkeleton && discoverProducts.length > 0\">\n                <h6 class=\"header\">{{ discoverText }}</h6>\n\n                <div *ngFor=\"let discoverProduct of discoverProducts\"\n                role=\"button\"\n                    tabindex=\"0\"\n                    class=\"product\"\n                    (click)=\"emitProductClick(discoverProduct)\"\n                    (keydown)=\"onProductKeyReleased($event, discoverProduct)\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"productTemplate\"\n                        [ngTemplateOutletContext]=\"{ product: discoverProduct }\">\n                    </ng-container>\n                </div>\n            </ng-container>\n        </div>\n    </dx-scroll-view>\n</dx-popover>\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/spicainternational-ngx-sds-components-src-lib-modal.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, ViewChild, Output, Input, ContentChild, Component, ElementRef } from '@angular/core';
+import { input, EventEmitter, ViewChild, Output, Input, ContentChild, Component, ElementRef } from '@angular/core';
 import { faXmark } from '@fortawesome/pro-regular-svg-icons';
 import { CdkDrag, CdkDragHandle } from '@angular/cdk/drag-drop';
 import { NgClass, NgIf } from '@angular/common';
@@ -29,6 +29,12 @@ class SdsModalComponent {
          * @memberof SdsModalComponent
          */
         this.isDragConstrained = true;
+        /**
+         * @description
+         * Label for the close button, used for accessibility.
+         * If not provided, it will fall back to the default translation for "close".
+         */
+        this.closeButtonLabel = input();
         /**
          * @deprecated Use isOpenChange instead
          */
@@ -90,7 +96,7 @@ class SdsModalComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsModalComponent, isStandalone: true, selector: "sds-modal", inputs: { modalTitle: "modalTitle", showHeader: "showHeader", showFooter: "showFooter", size: "size", modalDialogId: "modalDialogId", showCloseButton: "showCloseButton", autoFocusCloseButton: "autoFocusCloseButton", translations: "translations", isScrollable: "isScrollable", isVerticallyCentered: "isVerticallyCentered", closeOnEscape: "closeOnEscape", downSizing: "downSizing", isDraggable: "isDraggable", isDragConstrained: "isDragConstrained", isOpen: "isOpen" }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick", closeEscapeKeypress: "closeEscapeKeypress", isOpenChange: "isOpenChange" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }, { propertyName: "_closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div \n    #modal \n    class=\"modal modal-backdrop\" \n    (keydown)=\"onKeydown($event)\" \n    [cdkTrapFocus]=\"isOpen\" \n    [cdkTrapFocusAutoCapture]=\"true\" \n    >\n    <div\n        class=\"modal-dialog\"\n        [class.modal-dialog-scrollable] = \"isScrollable\"\n        [class.downsize-continuous] = \"downSizing === 'continuous'\"\n        [class.modal-dialog-centered] = \"isVerticallyCentered\"\n        [attr.id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n        >\n        <div \n            class=\"modal-content\" \n            cdkDrag [cdkDragDisabled]=\"!isDraggable\" [cdkDragBoundary]=\"isDragConstrained ? '.modal-backdrop' : ''\"\n            >\n\n            <div *ngIf=\"isDraggable\" class=\"modal-drag-handle\" cdkDragHandle></div>\n\n            <div \n                *ngIf=\"showHeader && headerContent\" \n                class=\"modal-header\" \n                >\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div \n                *ngIf=\"showHeader && !headerContent\" \n                class=\"modal-header\"\n                >\n\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    #closeButton\n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"btn-close sds-fs-75\" \n                    [title]=\"translations.close ?? ''\"\n                    (click)=\"onCloseButtonClick()\">\n                </button>\n            </div>\n\n            <div \n                class=\"modal-body\"\n                [class.pt-0]=\"showHeader\"\n                [class.pb-0]=\"showFooter\"\n                >\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>", styles: [".modal{background:#00000080}.modal .modal-drag-handle{cursor:move;position:absolute;width:100%;height:1rem}.modal .modal-header button.btn-close{font-size:.75em}.modal .modal-header button.btn-close:hover{background-color:var(--bs-gray-200)}.modal.in{opacity:1}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}@media (min-width: 820px){.modal-820{max-width:820px}}@media (min-width: 576px){.modal-dialog.downsize-continuous{width:calc(90vw - 2rem)}.modal-dialog.downsize-continuous.modal-md{max-width:var(--bs-breakpoint-sm)}.modal-dialog.downsize-continuous.modal-lg{max-width:var(--bs-breakpoint-md)}.modal-dialog.downsize-continuous.modal-xl{max-width:var(--bs-breakpoint-lg)}.modal-dialog.downsize-continuous.modal-xxl{max-width:var(--bs-breakpoint-xl)}}\n"], dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: SdsModalComponent, isStandalone: true, selector: "sds-modal", inputs: { modalTitle: { classPropertyName: "modalTitle", publicName: "modalTitle", isSignal: false, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: false, isRequired: false, transformFunction: null }, showFooter: { classPropertyName: "showFooter", publicName: "showFooter", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, modalDialogId: { classPropertyName: "modalDialogId", publicName: "modalDialogId", isSignal: false, isRequired: false, transformFunction: null }, showCloseButton: { classPropertyName: "showCloseButton", publicName: "showCloseButton", isSignal: false, isRequired: false, transformFunction: null }, autoFocusCloseButton: { classPropertyName: "autoFocusCloseButton", publicName: "autoFocusCloseButton", isSignal: false, isRequired: false, transformFunction: null }, translations: { classPropertyName: "translations", publicName: "translations", isSignal: false, isRequired: false, transformFunction: null }, isScrollable: { classPropertyName: "isScrollable", publicName: "isScrollable", isSignal: false, isRequired: false, transformFunction: null }, isVerticallyCentered: { classPropertyName: "isVerticallyCentered", publicName: "isVerticallyCentered", isSignal: false, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: false, isRequired: false, transformFunction: null }, downSizing: { classPropertyName: "downSizing", publicName: "downSizing", isSignal: false, isRequired: false, transformFunction: null }, isDraggable: { classPropertyName: "isDraggable", publicName: "isDraggable", isSignal: false, isRequired: false, transformFunction: null }, isDragConstrained: { classPropertyName: "isDragConstrained", publicName: "isDragConstrained", isSignal: false, isRequired: false, transformFunction: null }, closeButtonLabel: { classPropertyName: "closeButtonLabel", publicName: "closeButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { modalOpen: "modalOpen", modalClose: "modalClose", closeClick: "closeClick", closeEscapeKeypress: "closeEscapeKeypress", isOpenChange: "isOpenChange" }, queries: [{ propertyName: "headerContent", first: true, predicate: ["header"], descendants: true }], viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true }, { propertyName: "_closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n    #modal\n    class=\"modal modal-backdrop\"\n    (keydown)=\"onKeydown($event)\"\n    [cdkTrapFocus]=\"isOpen\"\n    [cdkTrapFocusAutoCapture]=\"true\"\n    >\n    <div\n        class=\"modal-dialog\"\n        [class.modal-dialog-scrollable] = \"isScrollable\"\n        [class.downsize-continuous] = \"downSizing === 'continuous'\"\n        [class.modal-dialog-centered] = \"isVerticallyCentered\"\n        [attr.id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n        >\n        <div\n            class=\"modal-content\"\n            cdkDrag [cdkDragDisabled]=\"!isDraggable\" [cdkDragBoundary]=\"isDragConstrained ? '.modal-backdrop' : ''\"\n            >\n\n            <div *ngIf=\"isDraggable\" class=\"modal-drag-handle\" cdkDragHandle></div>\n\n            <div\n                *ngIf=\"showHeader && headerContent\"\n                class=\"modal-header\"\n                >\n                <ng-content select='header'></ng-content>\n            </div>\n\n            <div\n                *ngIf=\"showHeader && !headerContent\"\n                class=\"modal-header\"\n                >\n\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button\n                    #closeButton\n                    *ngIf=\"showCloseButton\"\n                    type=\"button\"\n                    class=\"btn-close sds-fs-75\"\n                    [attr.aria-label]=\"closeButtonLabel() ?? translations.close\"\n                    [title]=\"translations.close ?? ''\"\n                    (click)=\"onCloseButtonClick()\">\n                </button>\n            </div>\n\n            <div\n                class=\"modal-body\"\n                [class.pt-0]=\"showHeader\"\n                [class.pb-0]=\"showFooter\"\n                >\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".modal{background:#00000080}.modal .modal-drag-handle{cursor:move;position:absolute;width:100%;height:1rem}.modal .modal-header button.btn-close{font-size:.75em}.modal .modal-header button.btn-close:hover{background-color:var(--bs-gray-200)}.modal.in{opacity:1}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}@media (min-width: 820px){.modal-820{max-width:820px}}@media (min-width: 576px){.modal-dialog.downsize-continuous{width:calc(90vw - 2rem)}.modal-dialog.downsize-continuous.modal-md{max-width:var(--bs-breakpoint-sm)}.modal-dialog.downsize-continuous.modal-lg{max-width:var(--bs-breakpoint-md)}.modal-dialog.downsize-continuous.modal-xl{max-width:var(--bs-breakpoint-lg)}.modal-dialog.downsize-continuous.modal-xxl{max-width:var(--bs-breakpoint-xl)}}\n"], dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsModalComponent, decorators: [{
             type: Component,
@@ -100,7 +106,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         CdkDrag,
                         NgIf,
                         CdkDragHandle,
-                    ], template: "<div \n    #modal \n    class=\"modal modal-backdrop\" \n    (keydown)=\"onKeydown($event)\" \n    [cdkTrapFocus]=\"isOpen\" \n    [cdkTrapFocusAutoCapture]=\"true\" \n    >\n    <div\n        class=\"modal-dialog\"\n        [class.modal-dialog-scrollable] = \"isScrollable\"\n        [class.downsize-continuous] = \"downSizing === 'continuous'\"\n        [class.modal-dialog-centered] = \"isVerticallyCentered\"\n        [attr.id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n        >\n        <div \n            class=\"modal-content\" \n            cdkDrag [cdkDragDisabled]=\"!isDraggable\" [cdkDragBoundary]=\"isDragConstrained ? '.modal-backdrop' : ''\"\n            >\n\n            <div *ngIf=\"isDraggable\" class=\"modal-drag-handle\" cdkDragHandle></div>\n\n            <div \n                *ngIf=\"showHeader && headerContent\" \n                class=\"modal-header\" \n                >\n                <ng-content select='header'></ng-content>\n            </div>             \n\n            <div \n                *ngIf=\"showHeader && !headerContent\" \n                class=\"modal-header\"\n                >\n\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button \n                    #closeButton\n                    *ngIf=\"showCloseButton\"\n                    type=\"button\" \n                    class=\"btn-close sds-fs-75\" \n                    [title]=\"translations.close ?? ''\"\n                    (click)=\"onCloseButtonClick()\">\n                </button>\n            </div>\n\n            <div \n                class=\"modal-body\"\n                [class.pt-0]=\"showHeader\"\n                [class.pb-0]=\"showFooter\"\n                >\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>            \n        </div>\n    </div>\n</div>", styles: [".modal{background:#00000080}.modal .modal-drag-handle{cursor:move;position:absolute;width:100%;height:1rem}.modal .modal-header button.btn-close{font-size:.75em}.modal .modal-header button.btn-close:hover{background-color:var(--bs-gray-200)}.modal.in{opacity:1}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}@media (min-width: 820px){.modal-820{max-width:820px}}@media (min-width: 576px){.modal-dialog.downsize-continuous{width:calc(90vw - 2rem)}.modal-dialog.downsize-continuous.modal-md{max-width:var(--bs-breakpoint-sm)}.modal-dialog.downsize-continuous.modal-lg{max-width:var(--bs-breakpoint-md)}.modal-dialog.downsize-continuous.modal-xl{max-width:var(--bs-breakpoint-lg)}.modal-dialog.downsize-continuous.modal-xxl{max-width:var(--bs-breakpoint-xl)}}\n"] }]
+                    ], template: "<div\n    #modal\n    class=\"modal modal-backdrop\"\n    (keydown)=\"onKeydown($event)\"\n    [cdkTrapFocus]=\"isOpen\"\n    [cdkTrapFocusAutoCapture]=\"true\"\n    >\n    <div\n        class=\"modal-dialog\"\n        [class.modal-dialog-scrollable] = \"isScrollable\"\n        [class.downsize-continuous] = \"downSizing === 'continuous'\"\n        [class.modal-dialog-centered] = \"isVerticallyCentered\"\n        [attr.id]=\"modalDialogId\"\n        [ngClass]=\"'modal-' + size\"\n        role=\"document\"\n        >\n        <div\n            class=\"modal-content\"\n            cdkDrag [cdkDragDisabled]=\"!isDraggable\" [cdkDragBoundary]=\"isDragConstrained ? '.modal-backdrop' : ''\"\n            >\n\n            <div *ngIf=\"isDraggable\" class=\"modal-drag-handle\" cdkDragHandle></div>\n\n            <div\n                *ngIf=\"showHeader && headerContent\"\n                class=\"modal-header\"\n                >\n                <ng-content select='header'></ng-content>\n            </div>\n\n            <div\n                *ngIf=\"showHeader && !headerContent\"\n                class=\"modal-header\"\n                >\n\n                <h5 class=\"modal-title\">{{modalTitle}}</h5>\n                <button\n                    #closeButton\n                    *ngIf=\"showCloseButton\"\n                    type=\"button\"\n                    class=\"btn-close sds-fs-75\"\n                    [attr.aria-label]=\"closeButtonLabel() ?? translations.close\"\n                    [title]=\"translations.close ?? ''\"\n                    (click)=\"onCloseButtonClick()\">\n                </button>\n            </div>\n\n            <div\n                class=\"modal-body\"\n                [class.pt-0]=\"showHeader\"\n                [class.pb-0]=\"showFooter\"\n                >\n                <ng-content></ng-content>\n            </div>\n\n            <div *ngIf=\"showFooter\" class=\"modal-footer\">\n                <ng-content select=\"footer\"></ng-content>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: [".modal{background:#00000080}.modal .modal-drag-handle{cursor:move;position:absolute;width:100%;height:1rem}.modal .modal-header button.btn-close{font-size:.75em}.modal .modal-header button.btn-close:hover{background-color:var(--bs-gray-200)}.modal.in{opacity:1}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0)}.modal-backdrop.fade{filter:alpha(opacity=0);opacity:0}.modal-backdrop.in{filter:alpha(opacity=50);opacity:.5}@media (min-width: 820px){.modal-820{max-width:820px}}@media (min-width: 576px){.modal-dialog.downsize-continuous{width:calc(90vw - 2rem)}.modal-dialog.downsize-continuous.modal-md{max-width:var(--bs-breakpoint-sm)}.modal-dialog.downsize-continuous.modal-lg{max-width:var(--bs-breakpoint-md)}.modal-dialog.downsize-continuous.modal-xl{max-width:var(--bs-breakpoint-lg)}.modal-dialog.downsize-continuous.modal-xxl{max-width:var(--bs-breakpoint-xl)}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { headerContent: [{
                 type: ContentChild,
                 args: ['header']
@@ -262,11 +268,11 @@ class SdsDialogComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsDialogComponent, isStandalone: true, selector: "sds-dialog", inputs: { title: "title", dialogTitle: "dialogTitle", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", primaryButtonId: "primaryButtonId", primaryButtonDisabled: "primaryButtonDisabled", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", secondaryButtonId: "secondaryButtonId", secondaryButtonDisabled: "secondaryButtonDisabled", closeOnEscape: "closeOnEscape", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton", autofocusElement: "autofocusElement", modalDialogId: "modalDialogId", isOpen: "isOpen" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose", isOpenChange: "isOpenChange", primaryButtonClick: "primaryButtonClick", secondaryButtonClick: "secondaryButtonClick" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }, { propertyName: "_primaryButton", first: true, predicate: ["primaryButton"], descendants: true, read: ElementRef }, { propertyName: "_secondaryButton", first: true, predicate: ["secondaryButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<sds-modal\n    #modal\n    [modalTitle]=\"dialogTitle || title\"\n    [size]=\"size\"\n    [modalDialogId]=\"modalDialogId\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    [translations]=\"{ close: closeText}\"\n    [autoFocusCloseButton]=\"autofocusElement === 'close'\"\n    [closeOnEscape]=\"closeOnEscape\"\n    (closeClick)=\"onCloseClick()\"\n    (closeEscapeKeypress)=\"onCloseEscapeKeypress()\"\n    (modalClose)=\"onModalClose()\"\n    (modalOpen)=\"onModalOpen()\"\n    [(isOpen)]=\"isOpen\"\n>\n\n    <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\n        <ng-content></ng-content>\n    </div>\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            #secondaryButton\n            *ngIf=\"showSecondaryButton\"\n            [attr.id]=\"secondaryButtonId\"\n            [disabled]=\"secondaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            #primaryButton\n            *ngIf=\"showPrimaryButton\"\n            [attr.id]=\"primaryButtonId\"\n            [disabled]=\"primaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>\n", styles: [""], dependencies: [{ kind: "component", type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "autoFocusCloseButton", "translations", "isScrollable", "isVerticallyCentered", "closeOnEscape", "downSizing", "isDraggable", "isDragConstrained", "isOpen"], outputs: ["modalOpen", "modalClose", "closeClick", "closeEscapeKeypress", "isOpenChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SdsDialogComponent, isStandalone: true, selector: "sds-dialog", inputs: { title: "title", dialogTitle: "dialogTitle", closeText: "closeText", size: "size", primaryButtonText: "primaryButtonText", primaryButtonClass: "primaryButtonClass", primaryButtonType: "primaryButtonType", primaryButtonId: "primaryButtonId", primaryButtonDisabled: "primaryButtonDisabled", secondaryButtonText: "secondaryButtonText", secondaryButtonClass: "secondaryButtonClass", secondaryButtonType: "secondaryButtonType", secondaryButtonId: "secondaryButtonId", secondaryButtonDisabled: "secondaryButtonDisabled", closeOnEscape: "closeOnEscape", showHeader: "showHeader", showCloseButton: "showCloseButton", showPrimaryButton: "showPrimaryButton", showSecondaryButton: "showSecondaryButton", autofocusElement: "autofocusElement", modalDialogId: "modalDialogId", isOpen: "isOpen" }, outputs: { dialogOpen: "dialogOpen", dialogClose: "dialogClose", isOpenChange: "isOpenChange", primaryButtonClick: "primaryButtonClick", secondaryButtonClick: "secondaryButtonClick" }, viewQueries: [{ propertyName: "_modal", first: true, predicate: ["modal"], descendants: true, static: true }, { propertyName: "_content", first: true, predicate: ["content"], descendants: true, read: ElementRef, static: true }, { propertyName: "_primaryButton", first: true, predicate: ["primaryButton"], descendants: true, read: ElementRef }, { propertyName: "_secondaryButton", first: true, predicate: ["secondaryButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<sds-modal\n    #modal\n    [modalTitle]=\"dialogTitle || title\"\n    [size]=\"size\"\n    [modalDialogId]=\"modalDialogId\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    [translations]=\"{ close: closeText}\"\n    [autoFocusCloseButton]=\"autofocusElement === 'close'\"\n    [closeButtonLabel]=\"closeText\"\n    [closeOnEscape]=\"closeOnEscape\"\n    (closeClick)=\"onCloseClick()\"\n    (closeEscapeKeypress)=\"onCloseEscapeKeypress()\"\n    (modalClose)=\"onModalClose()\"\n    (modalOpen)=\"onModalOpen()\"\n    [(isOpen)]=\"isOpen\"\n>\n\n    <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\n        <ng-content></ng-content>\n    </div>\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            #secondaryButton\n            *ngIf=\"showSecondaryButton\"\n            [attr.id]=\"secondaryButtonId\"\n            [disabled]=\"secondaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            #primaryButton\n            *ngIf=\"showPrimaryButton\"\n            [attr.id]=\"primaryButtonId\"\n            [disabled]=\"primaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>\n", styles: [""], dependencies: [{ kind: "component", type: SdsModalComponent, selector: "sds-modal", inputs: ["modalTitle", "showHeader", "showFooter", "size", "modalDialogId", "showCloseButton", "autoFocusCloseButton", "translations", "isScrollable", "isVerticallyCentered", "closeOnEscape", "downSizing", "isDraggable", "isDragConstrained", "closeButtonLabel", "isOpen"], outputs: ["modalOpen", "modalClose", "closeClick", "closeEscapeKeypress", "isOpenChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SdsDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sds-dialog', standalone: true, imports: [SdsModalComponent, NgIf], template: "<sds-modal\n    #modal\n    [modalTitle]=\"dialogTitle || title\"\n    [size]=\"size\"\n    [modalDialogId]=\"modalDialogId\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    [translations]=\"{ close: closeText}\"\n    [autoFocusCloseButton]=\"autofocusElement === 'close'\"\n    [closeOnEscape]=\"closeOnEscape\"\n    (closeClick)=\"onCloseClick()\"\n    (closeEscapeKeypress)=\"onCloseEscapeKeypress()\"\n    (modalClose)=\"onModalClose()\"\n    (modalOpen)=\"onModalOpen()\"\n    [(isOpen)]=\"isOpen\"\n>\n\n    <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\n        <ng-content></ng-content>\n    </div>\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            #secondaryButton\n            *ngIf=\"showSecondaryButton\"\n            [attr.id]=\"secondaryButtonId\"\n            [disabled]=\"secondaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            #primaryButton\n            *ngIf=\"showPrimaryButton\"\n            [attr.id]=\"primaryButtonId\"\n            [disabled]=\"primaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>\n" }]
+            args: [{ selector: 'sds-dialog', standalone: true, imports: [SdsModalComponent, NgIf], template: "<sds-modal\n    #modal\n    [modalTitle]=\"dialogTitle || title\"\n    [size]=\"size\"\n    [modalDialogId]=\"modalDialogId\"\n    [showCloseButton]=\"showCloseButton\"\n    [showHeader]=\"showHeader\"\n    [translations]=\"{ close: closeText}\"\n    [autoFocusCloseButton]=\"autofocusElement === 'close'\"\n    [closeButtonLabel]=\"closeText\"\n    [closeOnEscape]=\"closeOnEscape\"\n    (closeClick)=\"onCloseClick()\"\n    (closeEscapeKeypress)=\"onCloseEscapeKeypress()\"\n    (modalClose)=\"onModalClose()\"\n    (modalOpen)=\"onModalOpen()\"\n    [(isOpen)]=\"isOpen\"\n>\n\n    <div #content [attr.tabindex]=\"autofocusElement === 'content' ? 0 : undefined\" >\n        <ng-content></ng-content>\n    </div>\n    <ng-container #footer ngProjectAs='footer'>\n        <button\n            #secondaryButton\n            *ngIf=\"showSecondaryButton\"\n            [attr.id]=\"secondaryButtonId\"\n            [disabled]=\"secondaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"secondaryButtonClass\"\n            (click)=\"onSecondaryClick()\"\n        >{{secondaryButtonText}}</button>\n        <button\n            #primaryButton\n            *ngIf=\"showPrimaryButton\"\n            [attr.id]=\"primaryButtonId\"\n            [disabled]=\"primaryButtonDisabled\"\n            class=\"btn\"\n            [class]=\"primaryButtonClass\"\n            (click)=\"onPrimaryClick()\"\n        >{{primaryButtonText}}</button>\n    </ng-container>\n</sds-modal>\n" }]
         }], ctorParameters: () => [], propDecorators: { title: [{
                 type: Input
             }], dialogTitle: [{