@alauda/ui 6.1.3-beta.3 → 6.1.3-beta.7

package/bundles/alauda-ui.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/table'), require('@angular/common'), require('@angular/common/http'), require('@angular/animations'), require('@angular/cdk/collections'), require('@angular/cdk/a11y'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('clipboard-polyfill'), require('@angular/cdk/bidi'), require('@angular/forms'), require('@angular/cdk/observers'), require('@angular/cdk/scrolling'), require('@angular/cdk/accordion'), require('dayjs'), require('dayjs/plugin/customParseFormat'), require('dayjs/plugin/isBetween')) :
-    typeof define === 'function' && define.amd ? define('@alauda/ui', ['exports', '@angular/core', 'rxjs', 'rxjs/operators', '@angular/cdk/table', '@angular/common', '@angular/common/http', '@angular/animations', '@angular/cdk/collections', '@angular/cdk/a11y', '@angular/cdk/overlay', '@angular/cdk/portal', 'clipboard-polyfill', '@angular/cdk/bidi', '@angular/forms', '@angular/cdk/observers', '@angular/cdk/scrolling', '@angular/cdk/accordion', 'dayjs', 'dayjs/plugin/customParseFormat', 'dayjs/plugin/isBetween'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.alauda = global.alauda || {}, global.alauda.ui = {}), global.ng.core, global.rxjs, global.rxjs.operators, global.ng.cdk.table, global.ng.common, global.ng.common.http, global.ng.animations, global.ng.cdk.collections, global.ng.cdk.a11y, global.ng.cdk.overlay, global.ng.cdk.portal, global.clipboardPolyfill, global.ng.cdk.bidi, global.ng.forms, global.ng.cdk.observers, global.ng.cdk.scrolling, global.ng.cdk.accordion, global.dayjs, global.customParseFormat, global.isBetween));
-}(this, (function (exports, i0, rxjs, operators, table, common, http, animations, collections, a11y, i1, portal, clipboardPolyfill, bidi, forms, observers, scrolling, accordion, dayjs, customParseFormat, isBetween) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('rxjs'), require('rxjs/operators'), require('@angular/cdk/table'), require('@angular/common'), require('@angular/common/http'), require('@angular/animations'), require('@angular/cdk/collections'), require('@angular/cdk/a11y'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('clipboard-polyfill'), require('@angular/cdk/scrolling'), require('@angular/cdk/bidi'), require('@angular/forms'), require('@angular/cdk/observers'), require('@angular/cdk/accordion'), require('dayjs'), require('dayjs/plugin/customParseFormat'), require('dayjs/plugin/isBetween')) :
+    typeof define === 'function' && define.amd ? define('@alauda/ui', ['exports', '@angular/core', 'rxjs', 'rxjs/operators', '@angular/cdk/table', '@angular/common', '@angular/common/http', '@angular/animations', '@angular/cdk/collections', '@angular/cdk/a11y', '@angular/cdk/overlay', '@angular/cdk/portal', 'clipboard-polyfill', '@angular/cdk/scrolling', '@angular/cdk/bidi', '@angular/forms', '@angular/cdk/observers', '@angular/cdk/accordion', 'dayjs', 'dayjs/plugin/customParseFormat', 'dayjs/plugin/isBetween'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.alauda = global.alauda || {}, global.alauda.ui = {}), global.ng.core, global.rxjs, global.rxjs.operators, global.ng.cdk.table, global.ng.common, global.ng.common.http, global.ng.animations, global.ng.cdk.collections, global.ng.cdk.a11y, global.ng.cdk.overlay, global.ng.cdk.portal, global.clipboardPolyfill, global.ng.cdk.scrolling, global.ng.cdk.bidi, global.ng.forms, global.ng.cdk.observers, global.ng.cdk.accordion, global.dayjs, global.customParseFormat, global.isBetween));
+}(this, (function (exports, i0, rxjs, operators, table, common, http, animations, collections, a11y, i1, portal, clipboardPolyfill, i2, bidi, forms, observers, accordion, dayjs, customParseFormat, isBetween) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -2898,8 +2898,9 @@
     }());
     DialogService.DIALOG_OVERLAY_PANE_CLASS = 'aui-dialog-overlay-pane';
     DialogService.DIALOG_BACKDROP_CLASS = 'aui-dialog-backdrop';
+    DialogService.ɵprov = i0.ɵɵdefineInjectable({ factory: function DialogService_Factory() { return new DialogService(i0.ɵɵinject(i1.Overlay), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i2.ScrollDispatcher), i0.ɵɵinject(i0.NgZone)); }, token: DialogService, providedIn: "root" });
     DialogService.decorators = [
-        { type: i0.Injectable }
+        { type: i0.Injectable, args: [{ providedIn: 'root' },] }
     ];
     DialogService.ctorParameters = function () { return [
         { type: i1.Overlay },
@@ -3049,7 +3050,6 @@
                         DialogCloseDirective,
                     ],
                     entryComponents: [DialogComponent, ConfirmDialogComponent],
-                    providers: [DialogService],
                 },] }
     ];
 
@@ -4836,7 +4836,7 @@
     NumberInputComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'aui-number-input',
-                    template: "<div\n  [class]=\"bem.block(size)\"\n  [ngClass]=\"{\n    isFocus: isFocus,\n    isDisabled: disabled\n  }\"\n  auiClickOutside\n  (auiClickOutside)=\"isFocus = false\"\n>\n  <button\n    *ngIf=\"controls\"\n    aui-button\n    type=\"button\"\n    [ngClass]=\"bem.element('decrease')\"\n    [disabled]=\"disabled || (value$ | async) <= min\"\n    (click)=\"takeOneStep(false); isFocus = true\"\n  >\n    <aui-icon icon=\"minus\"></aui-icon>\n  </button>\n  <input\n    #inputRef\n    autocomplete=\"off\"\n    (change)=\"inputChanged($any($event.target).value)\"\n    [disabled]=\"disabled\"\n    [ngClass]=\"bem.element('input')\"\n    [placeholder]=\"placeholder\"\n    (focus)=\"isFocus = true\"\n    (blur)=\"isFocus = false\"\n  />\n  <button\n    *ngIf=\"controls\"\n    aui-button\n    type=\"button\"\n    [ngClass]=\"bem.element('increase')\"\n    [disabled]=\"disabled || (value$ | async) >= max\"\n    (click)=\"takeOneStep(true); isFocus = true\"\n  >\n    <aui-icon icon=\"plus\"></aui-icon>\n  </button>\n</div>\n",
+                    template: "<div\n  [class]=\"bem.block(size)\"\n  [ngClass]=\"{\n    isFocus: isFocus,\n    isDisabled: disabled\n  }\"\n  auiClickOutside\n  (auiClickOutside)=\"isFocus = false\"\n>\n  <button\n    *ngIf=\"controls\"\n    aui-button\n    type=\"button\"\n    [ngClass]=\"bem.element('decrease')\"\n    [disabled]=\"disabled || (value$ | async) <= min\"\n    (click)=\"takeOneStep(false); isFocus = true\"\n  >\n    <aui-icon icon=\"minus\"></aui-icon>\n  </button>\n  <input\n    #inputRef\n    autocomplete=\"off\"\n    (change)=\"inputChanged($event.target.value)\"\n    [disabled]=\"disabled\"\n    [ngClass]=\"bem.element('input')\"\n    [placeholder]=\"placeholder\"\n    (focus)=\"isFocus = true\"\n    (blur)=\"isFocus = false\"\n  />\n  <button\n    *ngIf=\"controls\"\n    aui-button\n    type=\"button\"\n    [ngClass]=\"bem.element('increase')\"\n    [disabled]=\"disabled || (value$ | async) >= max\"\n    (click)=\"takeOneStep(true); isFocus = true\"\n  >\n    <aui-icon icon=\"plus\"></aui-icon>\n  </button>\n</div>\n",
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     encapsulation: i0.ViewEncapsulation.None,
                     preserveWhitespaces: false,
@@ -7056,6 +7056,19 @@
         { type: i0.ChangeDetectorRef }
     ]; };
 
+    var MessageModule = /** @class */ (function () {
+        function MessageModule() {
+        }
+        return MessageModule;
+    }());
+    MessageModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [common.CommonModule, i1.OverlayModule, IconModule],
+                    declarations: [MessageWrapperComponent, MessageComponent],
+                    entryComponents: [MessageWrapperComponent, MessageComponent],
+                },] }
+    ];
+
     var BaseMessage = /** @class */ (function () {
         function BaseMessage(overlay, injector, applicationRef, cfr, overlayPaneClassName, wrapperClass, componentClass, globalConfig) {
             this.overlay = overlay;
@@ -7151,8 +7164,9 @@
         }
         return MessageService;
     }(BaseMessage));
+    MessageService.ɵprov = i0.ɵɵdefineInjectable({ factory: function MessageService_Factory() { return new MessageService(i0.ɵɵinject(i1.Overlay), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i0.ApplicationRef), i0.ɵɵinject(i0.ComponentFactoryResolver), i0.ɵɵinject(MESSAGE_CONFIG, 8)); }, token: MessageService, providedIn: "root" });
     MessageService.decorators = [
-        { type: i0.Injectable }
+        { type: i0.Injectable, args: [{ providedIn: 'root' },] }
     ];
     MessageService.ctorParameters = function () { return [
         { type: i1.Overlay },
@@ -7162,20 +7176,6 @@
         { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [MESSAGE_CONFIG,] }] }
     ]; };
 
-    var MessageModule = /** @class */ (function () {
-        function MessageModule() {
-        }
-        return MessageModule;
-    }());
-    MessageModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    imports: [common.CommonModule, i1.OverlayModule, IconModule],
-                    declarations: [MessageWrapperComponent, MessageComponent],
-                    entryComponents: [MessageWrapperComponent, MessageComponent],
-                    providers: [MessageService],
-                },] }
-    ];
-
     var NotificationWrapperComponent = /** @class */ (function (_super) {
         __extends(NotificationWrapperComponent, _super);
         function NotificationWrapperComponent(elementRef) {
@@ -7304,6 +7304,19 @@
         onMouseLeave: [{ type: i0.HostListener, args: ['mouseleave',] }]
     };
 
+    var NotificationModule = /** @class */ (function () {
+        function NotificationModule() {
+        }
+        return NotificationModule;
+    }());
+    NotificationModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [common.CommonModule, i1.OverlayModule, portal.PortalModule, IconModule],
+                    declarations: [NotificationWrapperComponent, NotificationComponent],
+                    entryComponents: [NotificationWrapperComponent, NotificationComponent],
+                },] }
+    ];
+
     var NOTIFICATION_CONFIG = new i0.InjectionToken('NOTIFICATION_CONFIG');
     var NOTIFICATION_DEFAULT_CONFIG = {
         duration: 6000,
@@ -7317,8 +7330,9 @@
         }
         return NotificationService;
     }(BaseMessage));
+    NotificationService.ɵprov = i0.ɵɵdefineInjectable({ factory: function NotificationService_Factory() { return new NotificationService(i0.ɵɵinject(i1.Overlay), i0.ɵɵinject(i0.INJECTOR), i0.ɵɵinject(i0.ApplicationRef), i0.ɵɵinject(i0.ComponentFactoryResolver), i0.ɵɵinject(NOTIFICATION_CONFIG, 8)); }, token: NotificationService, providedIn: "root" });
     NotificationService.decorators = [
-        { type: i0.Injectable }
+        { type: i0.Injectable, args: [{ providedIn: 'root' },] }
     ];
     NotificationService.ctorParameters = function () { return [
         { type: i1.Overlay },
@@ -7328,20 +7342,6 @@
         { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [NOTIFICATION_CONFIG,] }] }
     ]; };
 
-    var NotificationModule = /** @class */ (function () {
-        function NotificationModule() {
-        }
-        return NotificationModule;
-    }());
-    NotificationModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    imports: [common.CommonModule, i1.OverlayModule, portal.PortalModule, IconModule],
-                    declarations: [NotificationWrapperComponent, NotificationComponent],
-                    entryComponents: [NotificationWrapperComponent, NotificationComponent],
-                    providers: [NotificationService],
-                },] }
-    ];
-
     var TabBodyComponent = /** @class */ (function () {
         function TabBodyComponent() {
             this.content$ = new rxjs.BehaviorSubject(null);
@@ -7939,7 +7939,7 @@
     ];
     TabHeaderComponent.ctorParameters = function () { return [
         { type: i0.ChangeDetectorRef },
-        { type: scrolling.ViewportRuler }
+        { type: i2.ViewportRuler }
     ]; };
     TabHeaderComponent.propDecorators = {
         type: [{ type: i0.Input }],
@@ -9931,7 +9931,7 @@
                     exportAs: 'viewPort',
                     providers: [
                         {
-                            provide: scrolling.VIRTUAL_SCROLL_STRATEGY,
+                            provide: i2.VIRTUAL_SCROLL_STRATEGY,
                             useFactory: _tableVirtualScrollDirectiveStrategyFactory,
                             deps: [i0.forwardRef(function () { return FixedSizeTableVirtualScrollDirective; })],
                         },
@@ -9946,21 +9946,21 @@
         table: [{ type: i0.ContentChild, args: [TableComponent, { static: false },] }]
     };
 
-    var ɵ0 = scrolling._fixedSizeVirtualScrollStrategyFactory;
+    var ɵ0 = i2._fixedSizeVirtualScrollStrategyFactory;
     var FixedSizeVirtualScrollDirective = /** @class */ (function (_super) {
         __extends(FixedSizeVirtualScrollDirective, _super);
         function FixedSizeVirtualScrollDirective() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
         return FixedSizeVirtualScrollDirective;
-    }(scrolling.CdkFixedSizeVirtualScroll));
+    }(i2.CdkFixedSizeVirtualScroll));
     FixedSizeVirtualScrollDirective.decorators = [
         { type: i0.Directive, args: [{
                     // tslint:disable-next-line: directive-selector
                     selector: 'aui-virtual-scroll-viewport[itemSize]',
                     providers: [
                         {
-                            provide: scrolling.VIRTUAL_SCROLL_STRATEGY,
+                            provide: i2.VIRTUAL_SCROLL_STRATEGY,
                             useFactory: ɵ0,
                             deps: [i0.forwardRef(function () { return FixedSizeVirtualScrollDirective; })],
                         },
@@ -10004,7 +10004,7 @@
             configurable: true
         });
         return VirtualForOfDirective;
-    }(scrolling.CdkVirtualForOf));
+    }(i2.CdkVirtualForOf));
     VirtualForOfDirective.decorators = [
         { type: i0.Directive, args: [{
                     selector: '[auiVirtualFor][auiVirtualForOf]',
@@ -10023,7 +10023,7 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         return VirtualScrollViewportComponent;
-    }(scrolling.CdkVirtualScrollViewport));
+    }(i2.CdkVirtualScrollViewport));
     VirtualScrollViewportComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'aui-virtual-scroll-viewport',
@@ -10038,7 +10038,7 @@
                     preserveWhitespaces: false,
                     providers: [
                         {
-                            provide: scrolling.CdkVirtualScrollViewport,
+                            provide: i2.CdkVirtualScrollViewport,
                             useExisting: VirtualScrollViewportComponent,
                         },
                     ],
@@ -10252,7 +10252,7 @@
         { type: i0.ApplicationRef },
         { type: i0.Injector },
         { type: i0.ElementRef },
-        { type: scrolling.CdkScrollable, decorators: [{ type: i0.Optional }] }
+        { type: i2.CdkScrollable, decorators: [{ type: i0.Optional }] }
     ]; };
     AnchorDirective.propDecorators = {
         auiAnchor: [{ type: i0.Input }],
@@ -11997,7 +11997,7 @@
         Object.defineProperty(DrawerComponent.prototype, "drawerClasses", {
             get: function () {
                 var _c;
-                return Object.assign({ drawer: true }, (!this.drawerClass ? null : (_c = {}, _c[this.drawerClass] = true, _c)));
+                return Object.assign({ 'aui-drawer': true }, (!this.drawerClass ? null : (_c = {}, _c[this.drawerClass] = true, _c)));
             },
             enumerable: false,
             configurable: true
@@ -12037,7 +12037,7 @@
                     this.open();
                 }
                 else {
-                    this.closure();
+                    this.dispose();
                 }
             }
         };
@@ -12067,7 +12067,7 @@
                         _this.hideOnClickOutside &&
                         event.target instanceof Node &&
                         !((_b = (_a = _this.overlayRef.hostElement) === null || _a === void 0 ? void 0 : _a.parentNode) === null || _b === void 0 ? void 0 : _b.contains(event.target))) {
-                        _this.closure();
+                        _this.dispose();
                     }
                 });
             }
@@ -12116,7 +12116,7 @@
             this.updateBodyOverflow();
             this.cdr.markForCheck();
         };
-        DrawerComponent.prototype.closure = function (result) {
+        DrawerComponent.prototype.dispose = function (result) {
             if (result === void 0) { result = null; }
             this.visible = false;
             this.close.next();
@@ -12133,7 +12133,7 @@
         };
         DrawerComponent.prototype.maskClick = function () {
             if (this.maskClosable && this.mask) {
-                this.closure();
+                this.dispose();
             }
         };
         DrawerComponent.prototype.ngOnDestroy = function () {
@@ -12145,10 +12145,10 @@
     DrawerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'aui-drawer',
-                    template: "<ng-template #drawerTemplate>\n  <div\n    [class.drawer-mask-open]=\"visible\"\n    class=\"drawer-mask\"\n    (click)=\"maskClick()\"\n    *ngIf=\"mask\"\n  ></div>\n  <div\n    [style.marginTop.px]=\"offsetY\"\n    [ngClass]=\"drawerClasses\"\n    [class.drawer-open]=\"visible\"\n    [ngStyle]=\"{\n      transform: transform,\n      width: width + 'px'\n    }\"\n  >\n    <div\n      class=\"drawer-content\"\n      [style.height]=\"'calc(100% - ' + offsetY + 'px)'\"\n    >\n      <div class=\"drawer-body-wrapper\">\n        <div class=\"drawer-header\">\n          <div class=\"drawer-title\">\n            <ng-container\n              *ngIf=\"!isTemplateRef(title || titleTemplate); else elseTemplate\"\n            >\n              {{ title }}\n            </ng-container>\n            <ng-template #elseTemplate>\n              <ng-container\n                *ngIf=\"title || titleTemplate\"\n                [ngTemplateOutlet]=\"$any(title || titleTemplate)\"\n                [ngTemplateOutletContext]=\"templateContext\"\n              ></ng-container>\n            </ng-template>\n          </div>\n          <div class=\"drawer-close\" *ngIf=\"showClose\" (click)=\"closure()\">\n            <aui-icon icon=\"close\"></aui-icon>\n          </div>\n        </div>\n\n        <div class=\"drawer-body\">\n          <ng-template cdkPortalOutlet></ng-template>\n          <ng-container *ngIf=\"isTemplateRef(content || contentTemplate)\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                $any(content || contentTemplate);\n                context: templateContext\n              \"\n            >\n            </ng-container>\n          </ng-container>\n        </div>\n\n        <div class=\"drawer-footer\" *ngIf=\"footer\">\n          <ng-container\n            *ngIf=\"!isTemplateRef(footer || footerTemplate); else elseTemplate\"\n          >\n            {{ footer }}\n          </ng-container>\n          <ng-template #elseTemplate>\n            <ng-container\n              *ngIf=\"footer || titleTemplate\"\n              [ngTemplateOutlet]=\"$any(footer || titleTemplate)\"\n              [ngTemplateOutletContext]=\"templateContext\"\n            ></ng-container>\n          </ng-template>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>\n",
+                    template: "<ng-template #drawerTemplate>\n  <div\n    *ngIf=\"mask\"\n    class=\"aui-drawer-mask\"\n    [class.isOpen]=\"visible\"\n    (click)=\"maskClick()\"\n  ></div>\n  <div\n    [style.marginTop.px]=\"offsetY\"\n    [ngClass]=\"drawerClasses\"\n    [class.isOpen]=\"visible\"\n    [ngStyle]=\"{\n      transform: transform,\n      width: width + 'px'\n    }\"\n  >\n    <div class=\"aui-drawer__content\">\n      <div class=\"aui-drawer__body-wrapper\">\n        <div class=\"aui-drawer__header\">\n          <div class=\"aui-drawer__title\">\n            <ng-container\n              *ngIf=\"!isTemplateRef(title || titleTemplate); else elseTemplate\"\n            >\n              {{ title }}\n            </ng-container>\n            <ng-template #elseTemplate>\n              <ng-container\n                *ngIf=\"title || titleTemplate\"\n                [ngTemplateOutlet]=\"title || titleTemplate\"\n                [ngTemplateOutletContext]=\"templateContext\"\n              ></ng-container>\n            </ng-template>\n          </div>\n          <div class=\"aui-drawer__close\" *ngIf=\"showClose\" (click)=\"dispose()\">\n            <aui-icon icon=\"close\"></aui-icon>\n          </div>\n        </div>\n\n        <div class=\"aui-drawer__body\">\n          <ng-template cdkPortalOutlet></ng-template>\n          <ng-container *ngIf=\"isTemplateRef(content || contentTemplate)\">\n            <ng-container\n              *ngTemplateOutlet=\"\n                content || contentTemplate;\n                context: templateContext\n              \"\n            >\n            </ng-container>\n          </ng-container>\n        </div>\n\n        <div *ngIf=\"footer || footerTemplate\" class=\"aui-drawer__footer\">\n          <ng-container\n            *ngIf=\"!isTemplateRef(footer || footerTemplate); else elseTemplate\"\n          >\n            {{ footer }}\n          </ng-container>\n          <ng-template #elseTemplate>\n            <ng-container\n              *ngIf=\"footer || titleTemplate\"\n              [ngTemplateOutlet]=\"footer || titleTemplate\"\n              [ngTemplateOutletContext]=\"templateContext\"\n            ></ng-container>\n          </ng-template>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>\n",
                     encapsulation: i0.ViewEncapsulation.None,
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
-                    styles: [".drawer-open .drawer-content{box-shadow:0 4px 16px 0 rgba(var(--aui-color-n-1),.2)}.drawer-mask{position:absolute;top:0;left:0;width:100%;height:0;opacity:.4;background-color:rgb(var(--aui-color-n-0))}.drawer-mask-open{height:100%}.drawer{height:100%;position:fixed;top:0;right:0;z-index:9999;transition:transform .3s,opacity .3s,box-shaow .3s}.drawer-content{background-color:rgb(var(--aui-color-n-10));position:absolute;height:100%;right:0;width:100%}.drawer-title{flex:1}.drawer-header{margin:20px 20px 0;background:rgb(var(--aui-color-n-10));display:flex;font-size:20px;font-weight:500;padding-bottom:16px;justify-content:space-between;border-bottom:1px solid rgb(var(--aui-color-n-7))}.drawer-close{z-index:10;display:flex;align-items:center;font-size:16px;cursor:pointer;color:rgb(var(--aui-color-n-4));margin-left:16px}.drawer-body-wrapper{width:100%;height:100%;flex-direction:column;flex-wrap:nowrap;display:flex;position:relative;z-index:1;background-clip:padding-box;border:0}.drawer-body{margin:16px 20px;overflow:hidden;overflow-y:auto;font-size:14px;height:calc(100% - 100px)}.drawer-footer{margin:0 20px 20px;padding-top:16px;border-top:1px solid rgb(var(--aui-color-n-7))}"]
+                    styles: [".aui-drawer-mask{position:absolute;top:0;left:0;width:100%;height:0;opacity:.4;background-color:rgb(var(--aui-color-n-0))}.aui-drawer-mask.isOpen{height:100%}.aui-drawer{position:fixed;top:0;bottom:0;right:0;z-index:9999;transition:transform .3s,opacity .3s,box-shaow .3s;font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);color:rgb(var(--aui-color-n-1))}.aui-drawer.isOpen .aui-drawer__content{box-shadow:0 4px 16px 0 rgba(var(--aui-color-n-1),.2)}.aui-drawer__content{background-color:rgb(var(--aui-color-n-10));position:absolute;height:100%;right:0;width:100%}.aui-drawer__header{margin:20px 20px 0;padding-bottom:16px;display:flex;justify-content:space-between;border-bottom:1px solid rgb(var(--aui-color-n-8))}.aui-drawer__title{flex:1;font-size:var(--aui-font-size-xxl);line-height:var(--aui-line-height-xxl);color:rgb(var(--aui-color-n-1));font-weight:var(--aui-font-weight-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aui-drawer__close{z-index:10;margin-left:16px;display:flex;align-items:center;font-size:var(--aui-icon-size-m);color:rgb(var(--aui-color-n-4));cursor:pointer}.aui-drawer__close:hover{color:rgb(var(--aui-color-primary))}.aui-drawer__body-wrapper{width:100%;height:100%;display:flex;flex-direction:column;flex-wrap:nowrap;position:relative;z-index:1}.aui-drawer__body{margin:16px 20px;overflow:hidden;overflow-y:auto;height:100%}.aui-drawer__footer{margin:0 20px 20px;padding-top:16px;border-top:1px solid rgb(var(--aui-color-n-8))}"]
                 },] }
     ];
     DrawerComponent.ctorParameters = function () { return [
@@ -12179,6 +12179,26 @@
         footerTemplate: [{ type: i0.ContentChild, args: [DrawerFooterDirective, { read: i0.TemplateRef },] }]
     };
 
+    var COMMON = [
+        DrawerComponent,
+        DrawerHeaderDirective,
+        DrawerContentDirective,
+        DrawerFooterDirective,
+    ];
+    var DrawerModule = /** @class */ (function () {
+        function DrawerModule() {
+        }
+        return DrawerModule;
+    }());
+    DrawerModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [common.CommonModule, IconModule, IconModule, i1.OverlayModule, portal.PortalModule],
+                    declarations: COMMON,
+                    exports: COMMON,
+                    entryComponents: [DrawerComponent],
+                },] }
+    ];
+
     var DrawerService = /** @class */ (function () {
         function DrawerService(overlay) {
             this.overlay = overlay;
@@ -12186,7 +12206,7 @@
         }
         DrawerService.prototype.open = function (options) {
             var _a, _b, _c;
-            (_b = (_a = this.drawerRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.closure();
+            (_b = (_a = this.drawerRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.dispose();
             this.createDrawer();
             this.updateOptions(options);
             return (_c = this.drawerRef) === null || _c === void 0 ? void 0 : _c.instance;
@@ -12224,27 +12244,6 @@
         { type: i1.Overlay }
     ]; };
 
-    var COMMON = [
-        DrawerComponent,
-        DrawerHeaderDirective,
-        DrawerContentDirective,
-        DrawerFooterDirective,
-    ];
-    var DrawerModule = /** @class */ (function () {
-        function DrawerModule() {
-        }
-        return DrawerModule;
-    }());
-    DrawerModule.decorators = [
-        { type: i0.NgModule, args: [{
-                    imports: [common.CommonModule, IconModule, IconModule, i1.OverlayModule, portal.PortalModule],
-                    declarations: COMMON,
-                    exports: COMMON,
-                    providers: [DrawerService],
-                    entryComponents: [DrawerComponent],
-                },] }
-    ];
-
     var StepState = {
         Default: 'default',
         Done: 'done',