@i-cell/ids-angular 0.1.13 → 0.2.0

package/fesm2022/i-cell-ids-angular-side-sheet.mjs

@@ -54,12 +54,12 @@ class SideSheetHeaderComponent {
         this._idsSideSheetHeaderType = IdsSideSheetHeader;
         this.closed = output();
         this.backClicked = output();
-        this.title = input();
-        this.header = input();
-        this.backButton = input();
-        this.isClosable = input();
-        this.isShowHeader = input(false);
-        this.closeTooltipText = input('');
+        this.title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
+        this.header = input(...(ngDevMode ? [undefined, { debugName: "header" }] : []));
+        this.backButton = input(...(ngDevMode ? [undefined, { debugName: "backButton" }] : []));
+        this.isClosable = input(...(ngDevMode ? [undefined, { debugName: "isClosable" }] : []));
+        this.isShowHeader = input(false, ...(ngDevMode ? [{ debugName: "isShowHeader" }] : []));
+        this.closeTooltipText = input('', ...(ngDevMode ? [{ debugName: "closeTooltipText" }] : []));
     }
     _onClose() {
         this.closed.emit();
@@ -67,10 +67,10 @@ class SideSheetHeaderComponent {
     _onBack() {
         this.backClicked.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: SideSheetHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: SideSheetHeaderComponent, isStandalone: true, selector: "app-side-sheet-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, backButton: { classPropertyName: "backButton", publicName: "backButton", isSignal: true, isRequired: false, transformFunction: null }, isClosable: { classPropertyName: "isClosable", publicName: "isClosable", isSignal: true, isRequired: false, transformFunction: null }, isShowHeader: { classPropertyName: "isShowHeader", publicName: "isShowHeader", isSignal: true, isRequired: false, transformFunction: null }, closeTooltipText: { classPropertyName: "closeTooltipText", publicName: "closeTooltipText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", backClicked: "backClicked" }, ngImport: i0, template: "@if (header() === _idsSideSheetHeaderType.DEFAULT && isShowHeader()) {\n  <div class=\"ids-side-sheet__header-left-content\">\n    @if (backButton()) {\n      <button class=\"back-btn\" type=\"button\" idsIconButton variant=\"surface\" appearance=\"standard\" (click)=\"_onBack()\">\n        <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"arrow-left\" />\n      </button>\n    }\n    <h2 id=\"side-sheet-title\" class=\"ids-side-sheet__title\">{{ title() }}</h2>\n  </div>\n  @if (isClosable()) {\n    <button\n      class=\"ids-side-sheet__header-close-btn\"\n      type=\"button\"\n      idsIconButton\n      variant=\"surface\"\n      appearance=\"standard\"\n      [idsTooltip]=\"closeTooltipText()\"\n      (click)=\"_onClose()\"\n    >\n      <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n    </button>\n  }\n}\n\n@else if (header() === _idsSideSheetHeaderType.CUSTOM) {\n  <ng-content/>\n}\n", dependencies: [{ kind: "component", type: IdsIconComponent, selector: "ids-icon", inputs: ["size", "sizeCollection", "variant", "fontIcon", "svgIcon", "aria-hidden"] }, { kind: "component", type: IdsIconButtonComponent, selector: "button[idsIconButton], a[idsIconButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "directive", type: IdsTooltipDirective, selector: "[idsTooltip]", inputs: ["idsTooltip", "idsTooltipPosition", "idsTooltipSize", "idsTooltipVariant", "idsTooltipShowDelay", "idsTooltipHideDelay", "idsTooltipDisabled", "idsTooltipTouchGestures", "idsTooltipTextAlign", "idsTooltipClass", "idsTooltipShowPointer"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SideSheetHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: SideSheetHeaderComponent, isStandalone: true, selector: "app-side-sheet-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, backButton: { classPropertyName: "backButton", publicName: "backButton", isSignal: true, isRequired: false, transformFunction: null }, isClosable: { classPropertyName: "isClosable", publicName: "isClosable", isSignal: true, isRequired: false, transformFunction: null }, isShowHeader: { classPropertyName: "isShowHeader", publicName: "isShowHeader", isSignal: true, isRequired: false, transformFunction: null }, closeTooltipText: { classPropertyName: "closeTooltipText", publicName: "closeTooltipText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", backClicked: "backClicked" }, ngImport: i0, template: "@if (header() === _idsSideSheetHeaderType.DEFAULT && isShowHeader()) {\n  <div class=\"ids-side-sheet__header-left-content\">\n    @if (backButton()) {\n      <button class=\"back-btn\" type=\"button\" idsIconButton variant=\"surface\" appearance=\"standard\" (click)=\"_onBack()\">\n        <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"arrow-left\" />\n      </button>\n    }\n    <h2 id=\"side-sheet-title\" class=\"ids-side-sheet__title\">{{ title() }}</h2>\n  </div>\n  @if (isClosable()) {\n    <button\n      class=\"ids-side-sheet__header-close-btn\"\n      type=\"button\"\n      idsIconButton\n      variant=\"surface\"\n      appearance=\"standard\"\n      [idsTooltip]=\"closeTooltipText()\"\n      (click)=\"_onClose()\"\n    >\n      <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n    </button>\n  }\n}\n\n@else if (header() === _idsSideSheetHeaderType.CUSTOM) {\n  <ng-content/>\n}\n", dependencies: [{ kind: "component", type: IdsIconComponent, selector: "ids-icon", inputs: ["size", "sizeCollection", "variant", "fontIcon", "svgIcon", "aria-hidden"] }, { kind: "component", type: IdsIconButtonComponent, selector: "button[idsIconButton], a[idsIconButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "directive", type: IdsTooltipDirective, selector: "[idsTooltip]", inputs: ["idsTooltip", "idsTooltipPosition", "idsTooltipSize", "idsTooltipVariant", "idsTooltipShowDelay", "idsTooltipHideDelay", "idsTooltipDisabled", "idsTooltipTouchGestures", "idsTooltipTextAlign", "idsTooltipClass", "idsTooltipShowPointer"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: SideSheetHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SideSheetHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-side-sheet-header', standalone: true, imports: [
                         IdsIconComponent,
@@ -86,23 +86,23 @@ class IdsSideSheetComponent extends ComponentBaseWithDefaults {
         this._idsSideSheetType = IdsSideSheetType;
         this._idsSideSheetHeaderType = IdsSideSheetHeader;
         this._idsSideSheetPositionType = IdsSideSheetPosition;
-        this.open = input(false);
+        this.open = input(false, ...(ngDevMode ? [{ debugName: "open" }] : []));
         this.closed = output();
         this.backClicked = output();
         this._defaultConfig = this._getDefaultConfig(defaultConfig, IDS_SIDE_SHEET_DEFAULT_CONFIG);
-        this.title = input('');
-        this.type = input(this._defaultConfig.type);
-        this.position = input(this._defaultConfig.position);
-        this.header = input(this._defaultConfig.header);
-        this.backButton = input(false);
-        this.isBackdrop = input(this._defaultConfig.isBackdrop);
-        this.backdropType = input(this._defaultConfig.backdropType);
-        this.backdropOpacity = input(this._defaultConfig.backdropOpacity);
-        this.isScrollable = input(this._defaultConfig.isScrollable);
-        this.isClosable = input(this._defaultConfig.isClosable);
-        this.isShowHeader = input(this._defaultConfig.isShowHeader);
-        this.closeTooltipText = input('');
-        this.size = input(this._defaultConfig.size);
+        this.title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
+        this.type = input(this._defaultConfig.type, ...(ngDevMode ? [{ debugName: "type" }] : []));
+        this.position = input(this._defaultConfig.position, ...(ngDevMode ? [{ debugName: "position" }] : []));
+        this.header = input(this._defaultConfig.header, ...(ngDevMode ? [{ debugName: "header" }] : []));
+        this.backButton = input(false, ...(ngDevMode ? [{ debugName: "backButton" }] : []));
+        this.isBackdrop = input(this._defaultConfig.isBackdrop, ...(ngDevMode ? [{ debugName: "isBackdrop" }] : []));
+        this.backdropType = input(this._defaultConfig.backdropType, ...(ngDevMode ? [{ debugName: "backdropType" }] : []));
+        this.backdropOpacity = input(this._defaultConfig.backdropOpacity, ...(ngDevMode ? [{ debugName: "backdropOpacity" }] : []));
+        this.isScrollable = input(this._defaultConfig.isScrollable, ...(ngDevMode ? [{ debugName: "isScrollable" }] : []));
+        this.isClosable = input(this._defaultConfig.isClosable, ...(ngDevMode ? [{ debugName: "isClosable" }] : []));
+        this.isShowHeader = input(this._defaultConfig.isShowHeader, ...(ngDevMode ? [{ debugName: "isShowHeader" }] : []));
+        this.closeTooltipText = input('', ...(ngDevMode ? [{ debugName: "closeTooltipText" }] : []));
+        this.size = input(this._defaultConfig.size, ...(ngDevMode ? [{ debugName: "size" }] : []));
         this._hostClasses = computed(() => this._getHostClasses([
             this.type(),
             this.size(),
@@ -115,7 +115,7 @@ class IdsSideSheetComponent extends ComponentBaseWithDefaults {
                 this.backdropOpacity(),
             ],
             this.backdropType(),
-        ]));
+        ]), ...(ngDevMode ? [{ debugName: "_hostClasses" }] : []));
     }
     get _hostName() {
         return 'side-sheet';
@@ -126,8 +126,8 @@ class IdsSideSheetComponent extends ComponentBaseWithDefaults {
     _onBack() {
         this.backClicked.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSideSheetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsSideSheetComponent, isStandalone: true, selector: "ids-side-sheet", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, backButton: { classPropertyName: "backButton", publicName: "backButton", isSignal: true, isRequired: false, transformFunction: null }, isBackdrop: { classPropertyName: "isBackdrop", publicName: "isBackdrop", isSignal: true, isRequired: false, transformFunction: null }, backdropType: { classPropertyName: "backdropType", publicName: "backdropType", isSignal: true, isRequired: false, transformFunction: null }, backdropOpacity: { classPropertyName: "backdropOpacity", publicName: "backdropOpacity", isSignal: true, isRequired: false, transformFunction: null }, isScrollable: { classPropertyName: "isScrollable", publicName: "isScrollable", isSignal: true, isRequired: false, transformFunction: null }, isClosable: { classPropertyName: "isClosable", publicName: "isClosable", isSignal: true, isRequired: false, transformFunction: null }, isShowHeader: { classPropertyName: "isShowHeader", publicName: "isShowHeader", isSignal: true, isRequired: false, transformFunction: null }, closeTooltipText: { classPropertyName: "closeTooltipText", publicName: "closeTooltipText", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", backClicked: "backClicked" }, host: { properties: { "class.open": "open()" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #content>\n  <ng-content/>\n</ng-template>\n\n<ng-template #customHeader>\n  <ng-content select=\"[slot='customHeader']\"/>\n</ng-template>\n\n<ng-template #footer>\n  <ng-content select=\"[slot='footer']\"/>\n</ng-template>\n\n@if (open() && type() === _idsSideSheetType.OVERLAY) {\n  @if(isBackdrop()) {\n    <div class=\"ids-side-sheet__backdrop\" (click)=\"_close()\"></div>\n  }\n  <div\n    class=\"ids-side-sheet__container\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"side-sheet-title\"\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n        <button\n          class=\"ids-side-sheet__close-btn\"\n          type=\"button\" idsIconButton\n          [variant]=\"'surface'\" [appearance]=\"'standard'\"\n          [idsTooltip]=\"closeTooltipText()\"\n          (click)=\"_close()\"\n        >\n          <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n        </button>\n      </div>\n    }\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n@if (open() && type() === _idsSideSheetType.INLINE) {\n  <div\n    class=\"ids-side-sheet__container--inline\"\n    role=\"region\"\n    aria-labelledby=\"side-sheet-title\"\n    cdkTrapFocus\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n\n          <button\n            class=\"ids-side-sheet__close-btn\"\n            type=\"button\"\n            idsIconButton\n            [variant]=\"'surface'\"\n            [appearance]=\"'standard'\"\n            [idsTooltip]=\"closeTooltipText()\"\n            (click)=\"_close()\"\n          >\n            <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n          </button>\n      </div>\n    }\n\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: IdsIconButtonComponent, selector: "button[idsIconButton], a[idsIconButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "component", type: IdsIconComponent, selector: "ids-icon", inputs: ["size", "sizeCollection", "variant", "fontIcon", "svgIcon", "aria-hidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SideSheetHeaderComponent, selector: "app-side-sheet-header", inputs: ["title", "header", "backButton", "isClosable", "isShowHeader", "closeTooltipText"], outputs: ["closed", "backClicked"] }, { kind: "directive", type: IdsTooltipDirective, selector: "[idsTooltip]", inputs: ["idsTooltip", "idsTooltipPosition", "idsTooltipSize", "idsTooltipVariant", "idsTooltipShowDelay", "idsTooltipHideDelay", "idsTooltipDisabled", "idsTooltipTouchGestures", "idsTooltipTextAlign", "idsTooltipClass", "idsTooltipShowPointer"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSideSheetComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: IdsSideSheetComponent, isStandalone: true, selector: "ids-side-sheet", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, backButton: { classPropertyName: "backButton", publicName: "backButton", isSignal: true, isRequired: false, transformFunction: null }, isBackdrop: { classPropertyName: "isBackdrop", publicName: "isBackdrop", isSignal: true, isRequired: false, transformFunction: null }, backdropType: { classPropertyName: "backdropType", publicName: "backdropType", isSignal: true, isRequired: false, transformFunction: null }, backdropOpacity: { classPropertyName: "backdropOpacity", publicName: "backdropOpacity", isSignal: true, isRequired: false, transformFunction: null }, isScrollable: { classPropertyName: "isScrollable", publicName: "isScrollable", isSignal: true, isRequired: false, transformFunction: null }, isClosable: { classPropertyName: "isClosable", publicName: "isClosable", isSignal: true, isRequired: false, transformFunction: null }, isShowHeader: { classPropertyName: "isShowHeader", publicName: "isShowHeader", isSignal: true, isRequired: false, transformFunction: null }, closeTooltipText: { classPropertyName: "closeTooltipText", publicName: "closeTooltipText", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed", backClicked: "backClicked" }, host: { properties: { "class.open": "open()" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #content>\n  <ng-content/>\n</ng-template>\n\n<ng-template #customHeader>\n  <ng-content select=\"[slot='customHeader']\"/>\n</ng-template>\n\n<ng-template #footer>\n  <ng-content select=\"[slot='footer']\"/>\n</ng-template>\n\n@if (open() && type() === _idsSideSheetType.OVERLAY) {\n  @if(isBackdrop()) {\n    <div class=\"ids-side-sheet__backdrop\" (click)=\"_close()\"></div>\n  }\n  <div\n    class=\"ids-side-sheet__container\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"side-sheet-title\"\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n        <button\n          class=\"ids-side-sheet__close-btn\"\n          type=\"button\" idsIconButton\n          [variant]=\"'surface'\" [appearance]=\"'standard'\"\n          [idsTooltip]=\"closeTooltipText()\"\n          (click)=\"_close()\"\n        >\n          <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n        </button>\n      </div>\n    }\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n@if (open() && type() === _idsSideSheetType.INLINE) {\n  <div\n    class=\"ids-side-sheet__container--inline\"\n    role=\"region\"\n    aria-labelledby=\"side-sheet-title\"\n    cdkTrapFocus\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n\n          <button\n            class=\"ids-side-sheet__close-btn\"\n            type=\"button\"\n            idsIconButton\n            [variant]=\"'surface'\"\n            [appearance]=\"'standard'\"\n            [idsTooltip]=\"closeTooltipText()\"\n            (click)=\"_close()\"\n          >\n            <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n          </button>\n      </div>\n    }\n\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: IdsIconButtonComponent, selector: "button[idsIconButton], a[idsIconButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "component", type: IdsIconComponent, selector: "ids-icon", inputs: ["size", "sizeCollection", "variant", "fontIcon", "svgIcon", "aria-hidden"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SideSheetHeaderComponent, selector: "app-side-sheet-header", inputs: ["title", "header", "backButton", "isClosable", "isShowHeader", "closeTooltipText"], outputs: ["closed", "backClicked"] }, { kind: "directive", type: IdsTooltipDirective, selector: "[idsTooltip]", inputs: ["idsTooltip", "idsTooltipPosition", "idsTooltipSize", "idsTooltipVariant", "idsTooltipShowDelay", "idsTooltipHideDelay", "idsTooltipDisabled", "idsTooltipTouchGestures", "idsTooltipTextAlign", "idsTooltipClass", "idsTooltipShowPointer"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [
             trigger('slideInOut', [
                 transition('void => left', [
                     style({ transform: 'translateX(-100%)' }),
@@ -142,7 +142,7 @@ class IdsSideSheetComponent extends ComponentBaseWithDefaults {
             ]),
         ] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSideSheetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSideSheetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ids-side-sheet', standalone: true, animations: [
                         trigger('slideInOut', [

package/fesm2022/i-cell-ids-angular-side-sheet.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"i-cell-ids-angular-side-sheet.mjs","sources":["../../../projects/widgets/side-sheet/types/side-sheet.type.ts","../../../projects/widgets/side-sheet/side-sheet-defaults.ts","../../../projects/widgets/side-sheet/side-sheet-header/side-sheet-header.component.ts","../../../projects/widgets/side-sheet/side-sheet-header/side-sheet-header.component.html","../../../projects/widgets/side-sheet/side-sheet.component.ts","../../../projects/widgets/side-sheet/side-sheet.component.html","../../../projects/widgets/side-sheet/i-cell-ids-angular-side-sheet.ts"],"sourcesContent":["export const IdsSideSheetType = {\n  OVERLAY: 'overlay',\n  INLINE: 'inline',\n} as const;\n\nexport type IdsSideSheetTypeType = (typeof IdsSideSheetType)[keyof typeof IdsSideSheetType];\n\nexport const IdsSideSheetPosition = {\n  LEFT: 'left',\n  RIGHT: 'right',\n} as const;\n\nexport type IdsSideSheetPositionType = (typeof IdsSideSheetPosition)[keyof typeof IdsSideSheetPosition];\n\nexport const IdsSideSheetHeader = {\n  DEFAULT: 'default',\n  CUSTOM: 'custom',\n} as const;\n\nexport const IdsBackdropType = {\n  DEFAULT: 'default',\n  TRANSPARENT: 'transparent',\n} as const;\n\nexport type IdsBackdropTypeType = (typeof IdsBackdropType)[keyof typeof IdsBackdropType];\n\nexport type IdsSideSheetHeaderType = (typeof IdsSideSheetHeader)[keyof typeof IdsSideSheetHeader];\n","import {\n  IdsBackdropType,\n  IdsBackdropTypeType,\n  IdsSideSheetHeader,\n  IdsSideSheetHeaderType, IdsSideSheetPosition,\n  IdsSideSheetPositionType, IdsSideSheetType,\n  IdsSideSheetTypeType,\n} from './types/side-sheet.type';\n\nimport { InjectionToken } from '@angular/core';\nimport { IdsSize, IdsSizeType } from '@i-cell/ids-angular/core';\n\nexport interface IdsSideSheetDefaultConfig {\n  type: IdsSideSheetTypeType\n  position: IdsSideSheetPositionType\n  header: IdsSideSheetHeaderType\n  isScrollable: boolean\n  isBackdrop: boolean\n  backdropType: IdsBackdropTypeType\n  backdropOpacity: IdsSizeType\n  isClosable: boolean\n  isShowFooter: boolean\n  isShowHeader: boolean\n  isStatic: boolean\n  closeTooltipText: string\n  size: IdsSizeType\n}\n\nexport const IDS_SIDE_SHEET_DEFAULT_CONFIG = new InjectionToken<IdsSideSheetDefaultConfig>(\n  'IDS_SIDE_SHEET_DEFAULT_CONFIG',\n  {\n    providedIn: 'root',\n    factory: IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY,\n  },\n);\n\nexport function IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY(): Required<IdsSideSheetDefaultConfig> {\n  return {\n    type: IdsSideSheetType.INLINE,\n    position: IdsSideSheetPosition.LEFT,\n    header: IdsSideSheetHeader.DEFAULT,\n    isScrollable: false,\n    isBackdrop: true,\n    backdropType: IdsBackdropType.DEFAULT,\n    backdropOpacity: IdsSize.COMPACT,\n    isClosable: true,\n    isShowFooter: true,\n    isShowHeader: true,\n    isStatic: false,\n    closeTooltipText: '',\n    size: IdsSize.COMPACT,\n  };\n};\n","import { IdsSideSheetHeader } from '../types/side-sheet.type';\n\nimport { Component, input, output } from '@angular/core';\nimport { IdsIconComponent } from '@i-cell/ids-angular/icon';\nimport { IdsIconButtonComponent } from '@i-cell/ids-angular/icon-button';\nimport { IdsTooltipDirective } from '@i-cell/ids-angular/tooltip';\n\n@Component({\n  selector: 'app-side-sheet-header',\n  standalone: true,\n  templateUrl: './side-sheet-header.component.html',\n  imports: [\n    IdsIconComponent,\n    IdsIconButtonComponent,\n    IdsTooltipDirective,\n  ],\n})\nexport class SideSheetHeaderComponent {\n  protected _idsSideSheetHeaderType = IdsSideSheetHeader;\n  public closed = output();\n  public backClicked = output();\n\n  public title = input<string>();\n  public header = input();\n  public backButton = input();\n  public isClosable = input();\n  public isShowHeader = input<boolean>(false);\n  public closeTooltipText = input<string>('');\n\n  protected _onClose(): void {\n    this.closed.emit();\n  }\n\n  protected _onBack(): void {\n    this.backClicked.emit();\n  }\n\n}\n","@if (header() === _idsSideSheetHeaderType.DEFAULT && isShowHeader()) {\n  <div class=\"ids-side-sheet__header-left-content\">\n    @if (backButton()) {\n      <button class=\"back-btn\" type=\"button\" idsIconButton variant=\"surface\" appearance=\"standard\" (click)=\"_onBack()\">\n        <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"arrow-left\" />\n      </button>\n    }\n    <h2 id=\"side-sheet-title\" class=\"ids-side-sheet__title\">{{ title() }}</h2>\n  </div>\n  @if (isClosable()) {\n    <button\n      class=\"ids-side-sheet__header-close-btn\"\n      type=\"button\"\n      idsIconButton\n      variant=\"surface\"\n      appearance=\"standard\"\n      [idsTooltip]=\"closeTooltipText()\"\n      (click)=\"_onClose()\"\n    >\n      <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n    </button>\n  }\n}\n\n@else if (header() === _idsSideSheetHeaderType.CUSTOM) {\n  <ng-content/>\n}\n","import {\n  IDS_SIDE_SHEET_DEFAULT_CONFIG,\n  IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY,\n  IdsSideSheetDefaultConfig,\n} from './side-sheet-defaults';\nimport { SideSheetHeaderComponent } from './side-sheet-header/side-sheet-header.component';\nimport {\n  IdsBackdropTypeType,\n  IdsSideSheetPosition, IdsSideSheetPositionType,\n  IdsSideSheetType,\n  IdsSideSheetTypeType,\n  IdsSideSheetHeader } from './types/side-sheet.type';\n\nimport { trigger, transition, style, animate } from '@angular/animations';\nimport { A11yModule, CdkTrapFocus } from '@angular/cdk/a11y';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n  Component,\n  computed,\n  input,\n  output,\n} from '@angular/core';\nimport { ComponentBaseWithDefaults, IdsSizeType } from '@i-cell/ids-angular/core';\nimport { IdsIconComponent } from '@i-cell/ids-angular/icon';\nimport { IdsIconButtonComponent } from '@i-cell/ids-angular/icon-button';\nimport { IdsTooltipDirective } from '@i-cell/ids-angular/tooltip';\n\nconst defaultConfig = IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY();\n\n@Component({\n  selector: 'ids-side-sheet',\n  standalone: true,\n  templateUrl: './side-sheet.component.html',\n  animations: [\n    trigger('slideInOut', [\n      transition('void => left', [\n        style({ transform: 'translateX(-100%)' }),\n        animate('300ms ease-out', style({ transform: 'translateX(0)' })),\n      ]),\n      transition('left => void', [animate('300ms ease-in', style({ transform: 'translateX(-100%)' }))]),\n      transition('void => right', [\n        style({ transform: 'translateX(100%)' }),\n        animate('300ms ease-out', style({ transform: 'translateX(0)' })),\n      ]),\n      transition('right => void', [animate('300ms ease-in', style({ transform: 'translateX(100%)' }))]),\n    ]),\n  ],\n  host: {\n    '[class.open]': 'open()',\n  },\n  imports: [\n    IdsIconButtonComponent,\n    IdsIconComponent,\n    NgTemplateOutlet,\n    SideSheetHeaderComponent,\n    IdsTooltipDirective,\n    NgClass,\n    A11yModule,\n    CdkTrapFocus,\n  ],\n})\nexport class IdsSideSheetComponent extends ComponentBaseWithDefaults<IdsSideSheetDefaultConfig> {\n  protected override get _hostName(): string {\n    return 'side-sheet';\n  }\n\n  protected _idsSideSheetType = IdsSideSheetType;\n  protected _idsSideSheetHeaderType = IdsSideSheetHeader;\n  protected _idsSideSheetPositionType = IdsSideSheetPosition;\n  public open = input(false);\n  public closed = output();\n  public backClicked = output();\n\n  protected readonly _defaultConfig = this._getDefaultConfig(defaultConfig, IDS_SIDE_SHEET_DEFAULT_CONFIG);\n\n  public title = input<string>('');\n  public type = input<IdsSideSheetTypeType | string>(this._defaultConfig.type);\n  public position = input<IdsSideSheetPositionType | string>(this._defaultConfig.position);\n  public header = input(this._defaultConfig.header);\n  public backButton = input(false);\n  public isBackdrop = input(this._defaultConfig.isBackdrop);\n  public backdropType = input<IdsBackdropTypeType | string>(this._defaultConfig.backdropType);\n  public backdropOpacity = input<IdsSizeType | string>(this._defaultConfig.backdropOpacity);\n  public isScrollable = input(this._defaultConfig.isScrollable);\n  public isClosable = input(this._defaultConfig.isClosable);\n  public isShowHeader = input(this._defaultConfig.isShowHeader);\n  public closeTooltipText = input<string>('');\n  public size = input<IdsSideSheetTypeType | string>(this._defaultConfig.size);\n\n  protected _close(): void {\n    this.closed.emit();\n  }\n\n  protected _onBack(): void {\n    this.backClicked.emit();\n  }\n\n  protected _hostClasses = computed(() => this._getHostClasses([\n    this.type(),\n    this.size(),\n    [\n      `${this.position()}`,\n      this.size(),\n    ],\n    [\n      `${this.position()}-opacity`,\n      this.backdropOpacity(),\n    ],\n    this.backdropType(),\n  ]));\n\n}\n","<ng-template #content>\n  <ng-content/>\n</ng-template>\n\n<ng-template #customHeader>\n  <ng-content select=\"[slot='customHeader']\"/>\n</ng-template>\n\n<ng-template #footer>\n  <ng-content select=\"[slot='footer']\"/>\n</ng-template>\n\n@if (open() && type() === _idsSideSheetType.OVERLAY) {\n  @if(isBackdrop()) {\n    <div class=\"ids-side-sheet__backdrop\" (click)=\"_close()\"></div>\n  }\n  <div\n    class=\"ids-side-sheet__container\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"side-sheet-title\"\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n        <button\n          class=\"ids-side-sheet__close-btn\"\n          type=\"button\" idsIconButton\n          [variant]=\"'surface'\" [appearance]=\"'standard'\"\n          [idsTooltip]=\"closeTooltipText()\"\n          (click)=\"_close()\"\n        >\n          <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n        </button>\n      </div>\n    }\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n@if (open() && type() === _idsSideSheetType.INLINE) {\n  <div\n    class=\"ids-side-sheet__container--inline\"\n    role=\"region\"\n    aria-labelledby=\"side-sheet-title\"\n    cdkTrapFocus\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n\n          <button\n            class=\"ids-side-sheet__close-btn\"\n            type=\"button\"\n            idsIconButton\n            [variant]=\"'surface'\"\n            [appearance]=\"'standard'\"\n            [idsTooltip]=\"closeTooltipText()\"\n            (click)=\"_close()\"\n          >\n            <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n          </button>\n      </div>\n    }\n\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;AAAa,MAAA,gBAAgB,GAAG;AAC9B,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,MAAM,EAAE,QAAQ;;AAKL,MAAA,oBAAoB,GAAG;AAClC,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,KAAK,EAAE,OAAO;;AAKH,MAAA,kBAAkB,GAAG;AAChC,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,MAAM,EAAE,QAAQ;;AAGL,MAAA,eAAe,GAAG;AAC7B,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,WAAW,EAAE,aAAa;;;MCOf,6BAA6B,GAAG,IAAI,cAAc,CAC7D,+BAA+B,EAC/B;AACE,IAAA,UAAU,EAAE,MAAM;AAClB,IAAA,OAAO,EAAE,qCAAqC;AAC/C,CAAA;SAGa,qCAAqC,GAAA;IACnD,OAAO;QACL,IAAI,EAAE,gBAAgB,CAAC,MAAM;QAC7B,QAAQ,EAAE,oBAAoB,CAAC,IAAI;QACnC,MAAM,EAAE,kBAAkB,CAAC,OAAO;AAClC,QAAA,YAAY,EAAE,KAAK;AACnB,QAAA,UAAU,EAAE,IAAI;QAChB,YAAY,EAAE,eAAe,CAAC,OAAO;QACrC,eAAe,EAAE,OAAO,CAAC,OAAO;AAChC,QAAA,UAAU,EAAE,IAAI;AAChB,QAAA,YAAY,EAAE,IAAI;AAClB,QAAA,YAAY,EAAE,IAAI;AAClB,QAAA,QAAQ,EAAE,KAAK;AACf,QAAA,gBAAgB,EAAE,EAAE;QACpB,IAAI,EAAE,OAAO,CAAC,OAAO;KACtB;AACH;AAAC;;MCnCY,wBAAwB,CAAA;AAVrC,IAAA,WAAA,GAAA;QAWY,IAAuB,CAAA,uBAAA,GAAG,kBAAkB;QAC/C,IAAM,CAAA,MAAA,GAAG,MAAM,EAAE;QACjB,IAAW,CAAA,WAAA,GAAG,MAAM,EAAE;QAEtB,IAAK,CAAA,KAAA,GAAG,KAAK,EAAU;QACvB,IAAM,CAAA,MAAA,GAAG,KAAK,EAAE;QAChB,IAAU,CAAA,UAAA,GAAG,KAAK,EAAE;QACpB,IAAU,CAAA,UAAA,GAAG,KAAK,EAAE;AACpB,QAAA,IAAA,CAAA,YAAY,GAAG,KAAK,CAAU,KAAK,CAAC;AACpC,QAAA,IAAA,CAAA,gBAAgB,GAAG,KAAK,CAAS,EAAE,CAAC;AAU5C;IARW,QAAQ,GAAA;AAChB,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;;IAGV,OAAO,GAAA;AACf,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE;;8GAjBd,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAxB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,wBAAwB,+7BCjBrC,y5BA2BA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDfI,gBAAgB,EAChB,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,sBAAsB,2IACtB,mBAAmB,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,oBAAA,EAAA,gBAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,yBAAA,EAAA,qBAAA,EAAA,iBAAA,EAAA,uBAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FAGV,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBAVpC,SAAS;+BACE,uBAAuB,EAAA,UAAA,EACrB,IAAI,EAEP,OAAA,EAAA;wBACP,gBAAgB;wBAChB,sBAAsB;wBACtB,mBAAmB;AACpB,qBAAA,EAAA,QAAA,EAAA,y5BAAA,EAAA;;;AEYH,MAAM,aAAa,GAAG,qCAAqC,EAAE;AAkCvD,MAAO,qBAAsB,SAAQ,yBAAoD,CAAA;AAhC/F,IAAA,WAAA,GAAA;;QAqCY,IAAiB,CAAA,iBAAA,GAAG,gBAAgB;QACpC,IAAuB,CAAA,uBAAA,GAAG,kBAAkB;QAC5C,IAAyB,CAAA,yBAAA,GAAG,oBAAoB;AACnD,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC;QACnB,IAAM,CAAA,MAAA,GAAG,MAAM,EAAE;QACjB,IAAW,CAAA,WAAA,GAAG,MAAM,EAAE;QAEV,IAAc,CAAA,cAAA,GAAG,IAAI,CAAC,iBAAiB,CAAC,aAAa,EAAE,6BAA6B,CAAC;AAEjG,QAAA,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE,CAAC;QACzB,IAAI,CAAA,IAAA,GAAG,KAAK,CAAgC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;QACrE,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAoC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC;QACjF,IAAM,CAAA,MAAA,GAAG,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC;AAC1C,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC;QACzB,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;QAClD,IAAY,CAAA,YAAA,GAAG,KAAK,CAA+B,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC;QACpF,IAAe,CAAA,eAAA,GAAG,KAAK,CAAuB,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC;QAClF,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC;QACtD,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;QAClD,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC;AACtD,QAAA,IAAA,CAAA,gBAAgB,GAAG,KAAK,CAAS,EAAE,CAAC;QACpC,IAAI,CAAA,IAAA,GAAG,KAAK,CAAgC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;QAUlE,IAAY,CAAA,YAAA,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC;YAC3D,IAAI,CAAC,IAAI,EAAE;YACX,IAAI,CAAC,IAAI,EAAE;AACX,YAAA;AACE,gBAAA,CAAA,EAAG,IAAI,CAAC,QAAQ,EAAE,CAAE,CAAA;gBACpB,IAAI,CAAC,IAAI,EAAE;AACZ,aAAA;AACD,YAAA;AACE,gBAAA,CAAA,EAAG,IAAI,CAAC,QAAQ,EAAE,CAAU,QAAA,CAAA;gBAC5B,IAAI,CAAC,eAAe,EAAE;AACvB,aAAA;YACD,IAAI,CAAC,YAAY,EAAE;AACpB,SAAA,CAAC,CAAC;AAEJ;AAjDC,IAAA,IAAuB,SAAS,GAAA;AAC9B,QAAA,OAAO,YAAY;;IA0BX,MAAM,GAAA;AACd,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;;IAGV,OAAO,GAAA;AACf,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE;;8GAjCd,qBAAqB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,whEC7DlC,g5HAiHA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,ED9DI,sBAAsB,EAAA,QAAA,EAAA,yCAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,MAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACtB,gBAAgB,EAChB,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,gBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,EAChB,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,wBAAwB,mMACxB,mBAAmB,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,oBAAA,EAAA,gBAAA,EAAA,mBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,oBAAA,EAAA,yBAAA,EAAA,qBAAA,EAAA,iBAAA,EAAA,uBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACP,UAAU,EAxBA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,cAAA,EAAA,yBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA;YACV,OAAO,CAAC,YAAY,EAAE;gBACpB,UAAU,CAAC,cAAc,EAAE;AACzB,oBAAA,KAAK,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;oBACzC,OAAO,CAAC,gBAAgB,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,CAAC;iBACjE,CAAC;AACF,gBAAA,UAAU,CAAC,cAAc,EAAE,CAAC,OAAO,CAAC,eAAe,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC,CAAC,CAAC,CAAC;gBACjG,UAAU,CAAC,eAAe,EAAE;AAC1B,oBAAA,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;oBACxC,OAAO,CAAC,gBAAgB,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,CAAC;iBACjE,CAAC;AACF,gBAAA,UAAU,CAAC,eAAe,EAAE,CAAC,OAAO,CAAC,eAAe,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,CAAC,CAAC,CAAC;aAClG,CAAC;AACH,SAAA,EAAA,CAAA,CAAA;;2FAeU,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAhCjC,SAAS;+BACE,gBAAgB,EAAA,UAAA,EACd,IAAI,EAEJ,UAAA,EAAA;wBACV,OAAO,CAAC,YAAY,EAAE;4BACpB,UAAU,CAAC,cAAc,EAAE;AACzB,gCAAA,KAAK,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;gCACzC,OAAO,CAAC,gBAAgB,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,CAAC;6BACjE,CAAC;AACF,4BAAA,UAAU,CAAC,cAAc,EAAE,CAAC,OAAO,CAAC,eAAe,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC,CAAC,CAAC,CAAC;4BACjG,UAAU,CAAC,eAAe,EAAE;AAC1B,gCAAA,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;gCACxC,OAAO,CAAC,gBAAgB,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,CAAC;6BACjE,CAAC;AACF,4BAAA,UAAU,CAAC,eAAe,EAAE,CAAC,OAAO,CAAC,eAAe,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,CAAC,CAAC,CAAC;yBAClG,CAAC;qBACH,EACK,IAAA,EAAA;AACJ,wBAAA,cAAc,EAAE,QAAQ;qBACzB,EACQ,OAAA,EAAA;wBACP,sBAAsB;wBACtB,gBAAgB;wBAChB,gBAAgB;wBAChB,wBAAwB;wBACxB,mBAAmB;wBACnB,OAAO;wBACP,UAAU;wBACV,YAAY;AACb,qBAAA,EAAA,QAAA,EAAA,g5HAAA,EAAA;;;AE3DH;;AAEG;;;;"}
+{"version":3,"file":"i-cell-ids-angular-side-sheet.mjs","sources":["../../../projects/widgets/side-sheet/types/side-sheet.type.ts","../../../projects/widgets/side-sheet/side-sheet-defaults.ts","../../../projects/widgets/side-sheet/side-sheet-header/side-sheet-header.component.ts","../../../projects/widgets/side-sheet/side-sheet-header/side-sheet-header.component.html","../../../projects/widgets/side-sheet/side-sheet.component.ts","../../../projects/widgets/side-sheet/side-sheet.component.html","../../../projects/widgets/side-sheet/i-cell-ids-angular-side-sheet.ts"],"sourcesContent":["export const IdsSideSheetType = {\n  OVERLAY: 'overlay',\n  INLINE: 'inline',\n} as const;\n\nexport type IdsSideSheetTypeType = (typeof IdsSideSheetType)[keyof typeof IdsSideSheetType];\n\nexport const IdsSideSheetPosition = {\n  LEFT: 'left',\n  RIGHT: 'right',\n} as const;\n\nexport type IdsSideSheetPositionType = (typeof IdsSideSheetPosition)[keyof typeof IdsSideSheetPosition];\n\nexport const IdsSideSheetHeader = {\n  DEFAULT: 'default',\n  CUSTOM: 'custom',\n} as const;\n\nexport const IdsBackdropType = {\n  DEFAULT: 'default',\n  TRANSPARENT: 'transparent',\n} as const;\n\nexport type IdsBackdropTypeType = (typeof IdsBackdropType)[keyof typeof IdsBackdropType];\n\nexport type IdsSideSheetHeaderType = (typeof IdsSideSheetHeader)[keyof typeof IdsSideSheetHeader];\n","import {\n  IdsBackdropType,\n  IdsBackdropTypeType,\n  IdsSideSheetHeader,\n  IdsSideSheetHeaderType, IdsSideSheetPosition,\n  IdsSideSheetPositionType, IdsSideSheetType,\n  IdsSideSheetTypeType,\n} from './types/side-sheet.type';\n\nimport { InjectionToken } from '@angular/core';\nimport { IdsSize, IdsSizeType } from '@i-cell/ids-angular/core';\n\nexport interface IdsSideSheetDefaultConfig {\n  type: IdsSideSheetTypeType\n  position: IdsSideSheetPositionType\n  header: IdsSideSheetHeaderType\n  isScrollable: boolean\n  isBackdrop: boolean\n  backdropType: IdsBackdropTypeType\n  backdropOpacity: IdsSizeType\n  isClosable: boolean\n  isShowFooter: boolean\n  isShowHeader: boolean\n  isStatic: boolean\n  closeTooltipText: string\n  size: IdsSizeType\n}\n\nexport const IDS_SIDE_SHEET_DEFAULT_CONFIG = new InjectionToken<IdsSideSheetDefaultConfig>(\n  'IDS_SIDE_SHEET_DEFAULT_CONFIG',\n  {\n    providedIn: 'root',\n    factory: IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY,\n  },\n);\n\nexport function IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY(): Required<IdsSideSheetDefaultConfig> {\n  return {\n    type: IdsSideSheetType.INLINE,\n    position: IdsSideSheetPosition.LEFT,\n    header: IdsSideSheetHeader.DEFAULT,\n    isScrollable: false,\n    isBackdrop: true,\n    backdropType: IdsBackdropType.DEFAULT,\n    backdropOpacity: IdsSize.COMPACT,\n    isClosable: true,\n    isShowFooter: true,\n    isShowHeader: true,\n    isStatic: false,\n    closeTooltipText: '',\n    size: IdsSize.COMPACT,\n  };\n};\n","import { IdsSideSheetHeader } from '../types/side-sheet.type';\n\nimport { Component, input, output } from '@angular/core';\nimport { IdsIconComponent } from '@i-cell/ids-angular/icon';\nimport { IdsIconButtonComponent } from '@i-cell/ids-angular/icon-button';\nimport { IdsTooltipDirective } from '@i-cell/ids-angular/tooltip';\n\n@Component({\n  selector: 'app-side-sheet-header',\n  standalone: true,\n  templateUrl: './side-sheet-header.component.html',\n  imports: [\n    IdsIconComponent,\n    IdsIconButtonComponent,\n    IdsTooltipDirective,\n  ],\n})\nexport class SideSheetHeaderComponent {\n  protected _idsSideSheetHeaderType = IdsSideSheetHeader;\n  public closed = output();\n  public backClicked = output();\n\n  public title = input<string>();\n  public header = input();\n  public backButton = input();\n  public isClosable = input();\n  public isShowHeader = input<boolean>(false);\n  public closeTooltipText = input<string>('');\n\n  protected _onClose(): void {\n    this.closed.emit();\n  }\n\n  protected _onBack(): void {\n    this.backClicked.emit();\n  }\n\n}\n","@if (header() === _idsSideSheetHeaderType.DEFAULT && isShowHeader()) {\n  <div class=\"ids-side-sheet__header-left-content\">\n    @if (backButton()) {\n      <button class=\"back-btn\" type=\"button\" idsIconButton variant=\"surface\" appearance=\"standard\" (click)=\"_onBack()\">\n        <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"arrow-left\" />\n      </button>\n    }\n    <h2 id=\"side-sheet-title\" class=\"ids-side-sheet__title\">{{ title() }}</h2>\n  </div>\n  @if (isClosable()) {\n    <button\n      class=\"ids-side-sheet__header-close-btn\"\n      type=\"button\"\n      idsIconButton\n      variant=\"surface\"\n      appearance=\"standard\"\n      [idsTooltip]=\"closeTooltipText()\"\n      (click)=\"_onClose()\"\n    >\n      <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n    </button>\n  }\n}\n\n@else if (header() === _idsSideSheetHeaderType.CUSTOM) {\n  <ng-content/>\n}\n","import {\n  IDS_SIDE_SHEET_DEFAULT_CONFIG,\n  IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY,\n  IdsSideSheetDefaultConfig,\n} from './side-sheet-defaults';\nimport { SideSheetHeaderComponent } from './side-sheet-header/side-sheet-header.component';\nimport {\n  IdsBackdropTypeType,\n  IdsSideSheetPosition, IdsSideSheetPositionType,\n  IdsSideSheetType,\n  IdsSideSheetTypeType,\n  IdsSideSheetHeader } from './types/side-sheet.type';\n\nimport { trigger, transition, style, animate } from '@angular/animations';\nimport { A11yModule, CdkTrapFocus } from '@angular/cdk/a11y';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport {\n  Component,\n  computed,\n  input,\n  output,\n} from '@angular/core';\nimport { ComponentBaseWithDefaults, IdsSizeType } from '@i-cell/ids-angular/core';\nimport { IdsIconComponent } from '@i-cell/ids-angular/icon';\nimport { IdsIconButtonComponent } from '@i-cell/ids-angular/icon-button';\nimport { IdsTooltipDirective } from '@i-cell/ids-angular/tooltip';\n\nconst defaultConfig = IDS_SIDE_SHEET_DEFAULT_CONFIG_FACTORY();\n\n@Component({\n  selector: 'ids-side-sheet',\n  standalone: true,\n  templateUrl: './side-sheet.component.html',\n  animations: [\n    trigger('slideInOut', [\n      transition('void => left', [\n        style({ transform: 'translateX(-100%)' }),\n        animate('300ms ease-out', style({ transform: 'translateX(0)' })),\n      ]),\n      transition('left => void', [animate('300ms ease-in', style({ transform: 'translateX(-100%)' }))]),\n      transition('void => right', [\n        style({ transform: 'translateX(100%)' }),\n        animate('300ms ease-out', style({ transform: 'translateX(0)' })),\n      ]),\n      transition('right => void', [animate('300ms ease-in', style({ transform: 'translateX(100%)' }))]),\n    ]),\n  ],\n  host: {\n    '[class.open]': 'open()',\n  },\n  imports: [\n    IdsIconButtonComponent,\n    IdsIconComponent,\n    NgTemplateOutlet,\n    SideSheetHeaderComponent,\n    IdsTooltipDirective,\n    NgClass,\n    A11yModule,\n    CdkTrapFocus,\n  ],\n})\nexport class IdsSideSheetComponent extends ComponentBaseWithDefaults<IdsSideSheetDefaultConfig> {\n  protected override get _hostName(): string {\n    return 'side-sheet';\n  }\n\n  protected _idsSideSheetType = IdsSideSheetType;\n  protected _idsSideSheetHeaderType = IdsSideSheetHeader;\n  protected _idsSideSheetPositionType = IdsSideSheetPosition;\n  public open = input(false);\n  public closed = output();\n  public backClicked = output();\n\n  protected readonly _defaultConfig = this._getDefaultConfig(defaultConfig, IDS_SIDE_SHEET_DEFAULT_CONFIG);\n\n  public title = input<string>('');\n  public type = input<IdsSideSheetTypeType | string>(this._defaultConfig.type);\n  public position = input<IdsSideSheetPositionType | string>(this._defaultConfig.position);\n  public header = input(this._defaultConfig.header);\n  public backButton = input(false);\n  public isBackdrop = input(this._defaultConfig.isBackdrop);\n  public backdropType = input<IdsBackdropTypeType | string>(this._defaultConfig.backdropType);\n  public backdropOpacity = input<IdsSizeType | string>(this._defaultConfig.backdropOpacity);\n  public isScrollable = input(this._defaultConfig.isScrollable);\n  public isClosable = input(this._defaultConfig.isClosable);\n  public isShowHeader = input(this._defaultConfig.isShowHeader);\n  public closeTooltipText = input<string>('');\n  public size = input<IdsSideSheetTypeType | string>(this._defaultConfig.size);\n\n  protected _close(): void {\n    this.closed.emit();\n  }\n\n  protected _onBack(): void {\n    this.backClicked.emit();\n  }\n\n  protected _hostClasses = computed(() => this._getHostClasses([\n    this.type(),\n    this.size(),\n    [\n      `${this.position()}`,\n      this.size(),\n    ],\n    [\n      `${this.position()}-opacity`,\n      this.backdropOpacity(),\n    ],\n    this.backdropType(),\n  ]));\n\n}\n","<ng-template #content>\n  <ng-content/>\n</ng-template>\n\n<ng-template #customHeader>\n  <ng-content select=\"[slot='customHeader']\"/>\n</ng-template>\n\n<ng-template #footer>\n  <ng-content select=\"[slot='footer']\"/>\n</ng-template>\n\n@if (open() && type() === _idsSideSheetType.OVERLAY) {\n  @if(isBackdrop()) {\n    <div class=\"ids-side-sheet__backdrop\" (click)=\"_close()\"></div>\n  }\n  <div\n    class=\"ids-side-sheet__container\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"side-sheet-title\"\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n        <button\n          class=\"ids-side-sheet__close-btn\"\n          type=\"button\" idsIconButton\n          [variant]=\"'surface'\" [appearance]=\"'standard'\"\n          [idsTooltip]=\"closeTooltipText()\"\n          (click)=\"_close()\"\n        >\n          <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n        </button>\n      </div>\n    }\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n@if (open() && type() === _idsSideSheetType.INLINE) {\n  <div\n    class=\"ids-side-sheet__container--inline\"\n    role=\"region\"\n    aria-labelledby=\"side-sheet-title\"\n    cdkTrapFocus\n    [class.right]=\"position() === _idsSideSheetPositionType.RIGHT\"\n    [@slideInOut]=\"position()\">\n    @if(isClosable() && header() === _idsSideSheetHeaderType.CUSTOM) {\n      <div class=\"ids-side-sheet__header-custom-top-row\">\n\n          <button\n            class=\"ids-side-sheet__close-btn\"\n            type=\"button\"\n            idsIconButton\n            [variant]=\"'surface'\"\n            [appearance]=\"'standard'\"\n            [idsTooltip]=\"closeTooltipText()\"\n            (click)=\"_close()\"\n          >\n            <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n          </button>\n      </div>\n    }\n\n    <app-side-sheet-header\n      [ngClass]=\"{\n        'ids-side-sheet__header--custom': header() === _idsSideSheetHeaderType.CUSTOM,\n        'ids-side-sheet__header--default': header() !== _idsSideSheetHeaderType.CUSTOM\n      }\"\n      [header]=\"header()\"\n      [isShowHeader]=\"isShowHeader()\"\n      [title]=\"title()\"\n      [backButton]=\"backButton()\"\n      [isClosable]=\"isClosable()\"\n      [closeTooltipText]=\"closeTooltipText()\"\n      (closed)=\"_close()\"\n      (backClicked)=\"_onBack()\"\n    >\n      @if (header() === _idsSideSheetHeaderType.CUSTOM) {\n        <ng-container *ngTemplateOutlet=\"customHeader\"/>\n      }\n    </app-side-sheet-header>\n    <div class=\"ids-side-sheet__content\" [ngClass]=\"{ 'ids-side-sheet__content--scrollable': isScrollable() }\">\n      <ng-container *ngTemplateOutlet=\"content\"/>\n    </div>\n      <div class=\"ids-side-sheet__footer\">\n        <ng-container *ngTemplateOutlet=\"footer\"/>\n      </div>\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/i-cell-ids-angular-snackbar.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, input, output, computed, Component, ViewEncapsulation, ChangeDetectionStrategy, inject, signal, Injectable } from '@angular/core';
+import { InjectionToken, input, output, computed, ChangeDetectionStrategy, ViewEncapsulation, Component, inject, signal, Injectable } from '@angular/core';
 import { IdsSize, ComponentBase, coerceBooleanAttribute, ComponentBaseWithDefaults } from '@i-cell/ids-angular/core';
 import { trigger, transition, style, animate } from '@angular/animations';
 import * as i1 from '@angular/cdk/a11y';
@@ -86,26 +86,26 @@ class IdsSnackbarComponent extends ComponentBase {
         this._size = IdsSize;
         this._iconButtonAppearance = IdsIconButtonAppearance;
         this._buttonAppearance = IdsButtonAppearance;
-        this.message = input.required();
-        this.variant = input();
-        this.icon = input();
-        this.actions = input([]);
-        this.allowDismiss = input(false, { transform: coerceBooleanAttribute });
-        this.closeButtonLabel = input();
-        this.autoClose = input(false, { transform: coerceBooleanAttribute });
-        this.urgent = input(false, { transform: coerceBooleanAttribute });
+        this.message = input.required(...(ngDevMode ? [{ debugName: "message" }] : []));
+        this.variant = input(...(ngDevMode ? [undefined, { debugName: "variant" }] : []));
+        this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : []));
+        this.actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : []));
+        this.allowDismiss = input(false, ...(ngDevMode ? [{ debugName: "allowDismiss", transform: coerceBooleanAttribute }] : [{ transform: coerceBooleanAttribute }]));
+        this.closeButtonLabel = input(...(ngDevMode ? [undefined, { debugName: "closeButtonLabel" }] : []));
+        this.autoClose = input(false, ...(ngDevMode ? [{ debugName: "autoClose", transform: coerceBooleanAttribute }] : [{ transform: coerceBooleanAttribute }]));
+        this.urgent = input(false, ...(ngDevMode ? [{ debugName: "urgent", transform: coerceBooleanAttribute }] : [{ transform: coerceBooleanAttribute }]));
         this.closed = output();
-        this._canAutoClose = computed(() => !this.allowDismiss() && this.autoClose());
+        this._canAutoClose = computed(() => !this.allowDismiss() && this.autoClose(), ...(ngDevMode ? [{ debugName: "_canAutoClose" }] : []));
         this._duration = computed(() => {
             const actionReadDuration = (this.actions()?.length ?? 0) * READ_SPEED_PER_ACTION;
             return Math.max(this.message().length * READ_SPEED_PER_CHAR + actionReadDuration, MIN_DURATION);
-        });
+        }, ...(ngDevMode ? [{ debugName: "_duration" }] : []));
         this._hostClasses = computed(() => this._getHostClasses([
             this.variant(),
             this.allowDismiss() && !this.closeButtonLabel() ? 'width-close-x-button' : null,
-        ]));
-        this._role = computed(() => (this.urgent() ? 'alert' : 'status'));
-        this._buttonVariant = computed(() => (this.variant() === IdsSnackbarVariant.DARK ? IdsButtonVariant.LIGHT : IdsButtonVariant.SURFACE));
+        ]), ...(ngDevMode ? [{ debugName: "_hostClasses" }] : []));
+        this._role = computed(() => (this.urgent() ? 'alert' : 'status'), ...(ngDevMode ? [{ debugName: "_role" }] : []));
+        this._buttonVariant = computed(() => (this.variant() === IdsSnackbarVariant.DARK ? IdsButtonVariant.LIGHT : IdsButtonVariant.SURFACE), ...(ngDevMode ? [{ debugName: "_buttonVariant" }] : []));
         this._defaultIcon = computed(() => {
             switch (this.variant()) {
                 case IdsSnackbarVariant.DARK:
@@ -121,8 +121,8 @@ class IdsSnackbarComponent extends ComponentBase {
                 default:
                     return null;
             }
-        });
-        this._safeIcon = computed(() => this.icon() ?? this._defaultIcon());
+        }, ...(ngDevMode ? [{ debugName: "_defaultIcon" }] : []));
+        this._safeIcon = computed(() => this.icon() ?? this._defaultIcon(), ...(ngDevMode ? [{ debugName: "_safeIcon" }] : []));
     }
     get _hostName() {
         return 'snackbar';
@@ -159,10 +159,10 @@ class IdsSnackbarComponent extends ComponentBase {
     ngOnDestroy() {
         clearTimeout(this._timer);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsSnackbarComponent, isStandalone: true, selector: "ids-snackbar", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, allowDismiss: { classPropertyName: "allowDismiss", publicName: "allowDismiss", isSignal: true, isRequired: false, transformFunction: null }, closeButtonLabel: { classPropertyName: "closeButtonLabel", publicName: "closeButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "autoClose", isSignal: true, isRequired: false, transformFunction: null }, urgent: { classPropertyName: "urgent", publicName: "urgent", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, host: { listeners: { "mouseenter": "_onMouseEnter()", "mouseleave": "_onMouseLeave()" }, properties: { "role": "_role()" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ids-snackbar__content-wrapper\" cdkTrapFocus cdkTrapFocusAutoCapture=\"true\">\n  @let safeIcon = _safeIcon();\n  @if (safeIcon) {\n    <div class=\"ids-snackbar__leading-element\">\n      <ids-icon [fontIcon]=\"safeIcon\" />\n    </div>\n  }\n\n  <div class=\"ids-snackbar__message-action-container\">\n    <div class=\"ids-snackbar__message\">{{ message() }}</div>\n    <div class=\"ids-snackbar__action\">\n      @for (action of actions(); track $index) {\n        <button\n          type=\"button\"\n          idsButton\n          [size]=\"_size.COMPACT\"\n          [appearance]=\"_buttonAppearance.OUTLINED\"\n          [variant]=\"_buttonVariant()\"\n          (click)=\"callAction(action.action)\"\n        >\n          {{ action.label }}\n        </button>\n      }\n      @let safeCloseButtonLabel = allowDismiss() && closeButtonLabel();\n      @if (safeCloseButtonLabel) {\n        <button\n          type=\"button\"\n          role=\"button\"\n          aria-label=\"Close notification\"\n          idsButton\n          [size]=\"_size.COMPACT\"\n          [appearance]=\"_buttonAppearance.OUTLINED\"\n          [variant]=\"_buttonVariant()\"\n          (click)=\"close()\"\n        >\n          {{ safeCloseButtonLabel }}\n        </button>\n      }\n    </div>\n  </div>\n\n  @if (allowDismiss() && !closeButtonLabel()) {\n    <button\n      type=\"button\"\n      role=\"button\"\n      aria-label=\"Close notification\"\n      idsIconButton\n      [size]=\"_size.COMPACT\"\n      [appearance]=\"_iconButtonAppearance.STANDARD\"\n      [variant]=\"_buttonVariant()\"\n      (click)=\"close()\"\n    >\n      <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n    </button>\n  }\n</div>\n", dependencies: [{ kind: "component", type: IdsIconButtonComponent, selector: "button[idsIconButton], a[idsIconButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "component", type: IdsIconComponent, selector: "ids-icon", inputs: ["size", "sizeCollection", "variant", "fontIcon", "svgIcon", "aria-hidden"] }, { kind: "component", type: IdsButtonComponent, selector: "button[idsButton], a[idsButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: IdsSnackbarComponent, isStandalone: true, selector: "ids-snackbar", inputs: { message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, allowDismiss: { classPropertyName: "allowDismiss", publicName: "allowDismiss", isSignal: true, isRequired: false, transformFunction: null }, closeButtonLabel: { classPropertyName: "closeButtonLabel", publicName: "closeButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "autoClose", isSignal: true, isRequired: false, transformFunction: null }, urgent: { classPropertyName: "urgent", publicName: "urgent", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, host: { listeners: { "mouseenter": "_onMouseEnter()", "mouseleave": "_onMouseLeave()" }, properties: { "role": "_role()" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ids-snackbar__content-wrapper\" cdkTrapFocus cdkTrapFocusAutoCapture=\"true\">\n  @let safeIcon = _safeIcon();\n  @if (safeIcon) {\n    <div class=\"ids-snackbar__leading-element\">\n      <ids-icon [fontIcon]=\"safeIcon\" />\n    </div>\n  }\n\n  <div class=\"ids-snackbar__message-action-container\">\n    <div class=\"ids-snackbar__message\">{{ message() }}</div>\n    <div class=\"ids-snackbar__action\">\n      @for (action of actions(); track $index) {\n        <button\n          type=\"button\"\n          idsButton\n          [size]=\"_size.COMPACT\"\n          [appearance]=\"_buttonAppearance.OUTLINED\"\n          [variant]=\"_buttonVariant()\"\n          (click)=\"callAction(action.action)\"\n        >\n          {{ action.label }}\n        </button>\n      }\n      @let safeCloseButtonLabel = allowDismiss() && closeButtonLabel();\n      @if (safeCloseButtonLabel) {\n        <button\n          type=\"button\"\n          role=\"button\"\n          aria-label=\"Close notification\"\n          idsButton\n          [size]=\"_size.COMPACT\"\n          [appearance]=\"_buttonAppearance.OUTLINED\"\n          [variant]=\"_buttonVariant()\"\n          (click)=\"close()\"\n        >\n          {{ safeCloseButtonLabel }}\n        </button>\n      }\n    </div>\n  </div>\n\n  @if (allowDismiss() && !closeButtonLabel()) {\n    <button\n      type=\"button\"\n      role=\"button\"\n      aria-label=\"Close notification\"\n      idsIconButton\n      [size]=\"_size.COMPACT\"\n      [appearance]=\"_iconButtonAppearance.STANDARD\"\n      [variant]=\"_buttonVariant()\"\n      (click)=\"close()\"\n    >\n      <ids-icon aria-hidden=\"true\" alt=\"\" fontIcon=\"close\" />\n    </button>\n  }\n</div>\n", dependencies: [{ kind: "component", type: IdsIconButtonComponent, selector: "button[idsIconButton], a[idsIconButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "component", type: IdsIconComponent, selector: "ids-icon", inputs: ["size", "sizeCollection", "variant", "fontIcon", "svgIcon", "aria-hidden"] }, { kind: "component", type: IdsButtonComponent, selector: "button[idsButton], a[idsButton]", inputs: ["appearance", "size", "variant", "disabled"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ids-snackbar', imports: [
                         IdsIconButtonComponent,
@@ -182,7 +182,7 @@ class IdsSnackbarGroupComponent extends ComponentBaseWithDefaults {
         super(...arguments);
         this._snackbarService = inject(IdsSnackbarService);
         this._defaultConfig = this._getDefaultConfig(defaultConfig$1, IDS_SNACKBAR_DEFAULT_CONFIG);
-        this.position = signal(this._defaultConfig.position);
+        this.position = signal(this._defaultConfig.position, ...(ngDevMode ? [{ debugName: "position" }] : []));
         this.snackbars = this._snackbarService.snackbars;
         this._hostClasses = computed(() => this._getHostClasses([
             this._defaultConfig.size,
@@ -191,7 +191,7 @@ class IdsSnackbarGroupComponent extends ComponentBaseWithDefaults {
                 this.position(),
             ],
             this._defaultConfig.newestAtStartPosition ? 'newest-at-start' : null,
-        ]));
+        ]), ...(ngDevMode ? [{ debugName: "_hostClasses" }] : []));
         this._animationParams = computed(() => {
             switch (this.position()) {
                 case IdsSnackbarPosition.BOTTOM_CENTER:
@@ -221,7 +221,7 @@ class IdsSnackbarGroupComponent extends ComponentBaseWithDefaults {
                         height: '*',
                     };
             }
-        });
+        }, ...(ngDevMode ? [{ debugName: "_animationParams" }] : []));
     }
     get _hostName() {
         return 'snackbar-group';
@@ -241,10 +241,10 @@ class IdsSnackbarGroupComponent extends ComponentBaseWithDefaults {
     _updatePosition() {
         this._snackbarService.update();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsSnackbarGroupComponent, isStandalone: true, selector: "ids-snackbar-group", usesInheritance: true, ngImport: i0, template: "@for (snackbar of snackbars(); track snackbar.id) {\n  <ids-snackbar\n    [@snackbarAnimation]=\"{\n      value: 'open',\n      params: _animationParams(),\n    }\"\n    [message]=\"snackbar.message\"\n    [variant]=\"snackbar.variant\"\n    [icon]=\"snackbar.icon\"\n    [actions]=\"snackbar.actions\"\n    [allowDismiss]=\"snackbar.allowDismiss\"\n    [closeButtonLabel]=\"snackbar.closeButtonLabel\"\n    [autoClose]=\"snackbar.autoClose\"\n    [urgent]=\"snackbar.urgent\"\n    (@snackbarAnimation.start)=\"_onAnimateStart()\"\n    (@snackbarAnimation.done)=\"_onAnimateDone()\"\n    (closed)=\"closeSnackbar(snackbar.id)\"\n  />\n}\n", dependencies: [{ kind: "component", type: IdsSnackbarComponent, selector: "ids-snackbar", inputs: ["message", "variant", "icon", "actions", "allowDismiss", "closeButtonLabel", "autoClose", "urgent"], outputs: ["closed"] }], animations: [snackbarAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: IdsSnackbarGroupComponent, isStandalone: true, selector: "ids-snackbar-group", usesInheritance: true, ngImport: i0, template: "@for (snackbar of snackbars(); track snackbar.id) {\n  <ids-snackbar\n    [@snackbarAnimation]=\"{\n      value: 'open',\n      params: _animationParams(),\n    }\"\n    [message]=\"snackbar.message\"\n    [variant]=\"snackbar.variant\"\n    [icon]=\"snackbar.icon\"\n    [actions]=\"snackbar.actions\"\n    [allowDismiss]=\"snackbar.allowDismiss\"\n    [closeButtonLabel]=\"snackbar.closeButtonLabel\"\n    [autoClose]=\"snackbar.autoClose\"\n    [urgent]=\"snackbar.urgent\"\n    (@snackbarAnimation.start)=\"_onAnimateStart()\"\n    (@snackbarAnimation.done)=\"_onAnimateDone()\"\n    (closed)=\"closeSnackbar(snackbar.id)\"\n  />\n}\n", dependencies: [{ kind: "component", type: IdsSnackbarComponent, selector: "ids-snackbar", inputs: ["message", "variant", "icon", "actions", "allowDismiss", "closeButtonLabel", "autoClose", "urgent"], outputs: ["closed"] }], animations: [snackbarAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ids-snackbar-group', imports: [IdsSnackbarComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [snackbarAnimation], template: "@for (snackbar of snackbars(); track snackbar.id) {\n  <ids-snackbar\n    [@snackbarAnimation]=\"{\n      value: 'open',\n      params: _animationParams(),\n    }\"\n    [message]=\"snackbar.message\"\n    [variant]=\"snackbar.variant\"\n    [icon]=\"snackbar.icon\"\n    [actions]=\"snackbar.actions\"\n    [allowDismiss]=\"snackbar.allowDismiss\"\n    [closeButtonLabel]=\"snackbar.closeButtonLabel\"\n    [autoClose]=\"snackbar.autoClose\"\n    [urgent]=\"snackbar.urgent\"\n    (@snackbarAnimation.start)=\"_onAnimateStart()\"\n    (@snackbarAnimation.done)=\"_onAnimateDone()\"\n    (closed)=\"closeSnackbar(snackbar.id)\"\n  />\n}\n" }]
         }] });
@@ -346,7 +346,7 @@ class IdsSnackbarService {
         };
         this._snackbarGroupPortal = new ComponentPortal(IdsSnackbarGroupComponent, null);
         this._snackbarNextUniqueId = 0;
-        this._snackbars = signal([]);
+        this._snackbars = signal([], ...(ngDevMode ? [{ debugName: "_snackbars" }] : []));
         this.snackbars = this._snackbars.asReadonly();
         this._router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe(() => {
             this.clear();
@@ -422,10 +422,10 @@ class IdsSnackbarService {
     update() {
         this._overlayRef?.updatePosition();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSnackbarService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: IdsSnackbarService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',