@sd-angular/core 1.3.128 → 1.3.129

package/fesm2015/sd-angular-core-side-drawer.js

@@ -21,6 +21,7 @@ class SdSideDrawer {
         this.width = "480px";
         this.noCloseButton = false;
         this.noCloseClickOutSide = false;
+        this.alwaysDisplayBackDrop = false;
         this.editingChanged = new EventEmitter();
         _embeddedViewRef.set(this, void 0);
         this.isEditing = false;
@@ -56,6 +57,10 @@ class SdSideDrawer {
         this.noCloseClickOutSide = (val === '') || val;
         val = (val === '') || val;
     }
+    set _alwaysDisplayBackDrop(val) {
+        this.alwaysDisplayBackDrop = (val === '') || val;
+        val = (val === '') || val;
+    }
     ngAfterViewInit() {
         __classPrivateFieldSet(this, _embeddedViewRef, new DomPortalOutlet(document.body, this.cfr, this.ar, this.injector).attachTemplatePortal(this.portal));
     }
@@ -71,7 +76,7 @@ _embeddedViewRef = new WeakMap();
 SdSideDrawer.decorators = [
     { type: Component, args: [{
                 selector: "sd-side-drawer",
-                template: "<ng-template cdkPortal>\r\n  <div [id]=\"id\" class=\"side-drawer\" [ngStyle]=\"{'width': width}\" [ngClass]=\"{'side-drawer--active': isOpened,'side-drawer--loading': isLoading}\"\r\n    (mouseover)=\"isHover = true\" (mouseout)=\"isHover = false\">\r\n    <ng-container *ngIf=\"isOpened\">\r\n      <div class=\"side-drawer__header media align-items-center\">\r\n        <div class=\"side-drawer__title media-body\">\r\n          <ng-content select=\"[sdTitle]\"></ng-content>\r\n        </div>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"toggleEditable()\" *ngIf=\"editable\" mat-icon-button>\r\n          <mat-icon>edit</mat-icon>\r\n        </button>\r\n        <button *ngIf=\"!noCloseButton\" type=\"button\" class=\"c-action\" (click)=\"close()\" mat-icon-button>\r\n          <mat-icon>close</mat-icon>\r\n        </button>\r\n      </div>\r\n      <div *ngIf=\"isOpened\" class=\"side-drawer__body\">\r\n        <div class=\"side-drawer__content\">\r\n          <ng-content select=\"[sdBody]\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"side-drawer__footer\">\r\n        <ng-content select=\"[sdFooter]\"></ng-content>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <button *ngIf=\"isOpened\" type=\"button\" class=\"side-drawer-backdrop\" (click)=\"noCloseClickOutSide? null: close()\"\r\n    [ngClass]=\"{ 'side-drawer-backdrop--active': isHover }\"></button>\r\n</ng-template>\r\n",
+                template: "<ng-template cdkPortal>\r\n  <div [id]=\"id\" class=\"side-drawer\" [ngStyle]=\"{'width': width}\" [ngClass]=\"{'side-drawer--active': isOpened,'side-drawer--loading': isLoading}\"\r\n    (mouseover)=\"isHover = true\" (mouseout)=\"isHover = false\">\r\n    <ng-container *ngIf=\"isOpened\">\r\n      <div class=\"side-drawer__header media align-items-center\">\r\n        <div class=\"side-drawer__title media-body\">\r\n          <ng-content select=\"[sdTitle]\"></ng-content>\r\n        </div>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"toggleEditable()\" *ngIf=\"editable\" mat-icon-button>\r\n          <mat-icon>edit</mat-icon>\r\n        </button>\r\n        <button *ngIf=\"!noCloseButton\" type=\"button\" class=\"c-action\" (click)=\"close()\" mat-icon-button>\r\n          <mat-icon>close</mat-icon>\r\n        </button>\r\n      </div>\r\n      <div *ngIf=\"isOpened\" class=\"side-drawer__body\">\r\n        <div class=\"side-drawer__content\">\r\n          <ng-content select=\"[sdBody]\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"side-drawer__footer\">\r\n        <ng-content select=\"[sdFooter]\"></ng-content>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <button *ngIf=\"isOpened\" type=\"button\" class=\"side-drawer-backdrop\" (click)=\"noCloseClickOutSide? null: close()\"\r\n    [ngClass]=\"{ 'side-drawer-backdrop--active': !alwaysDisplayBackDrop? isHover: true }\"></button>\r\n</ng-template>\r\n",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [".text-black400{color:#757575}.side-drawer{background-color:#fff;bottom:0;box-shadow:0 .4px .8px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.2);display:flex;flex-direction:column;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transform:translate3d(100%,0,0);transition:all .3s ease-in-out;visibility:hidden;z-index:999}.c-action{color:#212121}.c-action:focus{outline:none}.side-drawer__icon{background:transparent;border:0;color:#212121;outline:none;overflow:hidden}.side-drawer__icon .mat-icon{float:left}.side-drawer__header{min-height:64px;padding:12px 16px}.side-drawer__body{flex:1;position:relative}.side-drawer__content{bottom:0;left:0;overflow:auto;padding:0 16px 16px;position:absolute;right:0;top:0}.side-drawer__footer{border-top:1px solid #dde0e5;padding:8px 0}.side-drawer-backdrop{background:none;border:0;bottom:0;height:100%;left:0;outline:none!important;position:fixed;right:0;top:0;transition:all .3s ease-in-out;width:100%;z-index:99}.side-drawer-backdrop--active{background-color:rgba(0,0,0,.4)}.side-drawer--active{opacity:1;pointer-events:all;transform:translateZ(0);visibility:visible}.side-drawer__title{font-size:20px;font-weight:500;line-height:28px}"]
             },] }
@@ -90,6 +95,7 @@ SdSideDrawer.propDecorators = {
     width: [{ type: Input }],
     _noCloseButton: [{ type: Input, args: ['noCloseButton',] }],
     _noCloseClickOutSide: [{ type: Input, args: ['noCloseClickOutSide',] }],
+    _alwaysDisplayBackDrop: [{ type: Input, args: ['alwaysDisplayBackDrop',] }],
     editingChanged: [{ type: Output }]
 };
 

package/fesm2015/sd-angular-core-side-drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-angular-core-side-drawer.js","sources":["../../../../projects/sd-core/side-drawer/src/lib/side-drawer/side-drawer.component.ts","../../../../projects/sd-core/side-drawer/src/lib/side-drawer.module.ts","../../../../projects/sd-core/side-drawer/src/public-api.ts","../../../../projects/sd-core/side-drawer/sd-angular-core-side-drawer.ts"],"sourcesContent":["import {\r\n  Component,\r\n  ViewChild,\r\n  ComponentFactoryResolver,\r\n  ApplicationRef,\r\n  Injector,\r\n  EmbeddedViewRef,\r\n  AfterViewInit,\r\n  OnDestroy,\r\n  Input,\r\n  Output,\r\n  EventEmitter,\r\n  ChangeDetectionStrategy,\r\n  ChangeDetectorRef,\r\n} from \"@angular/core\";\r\nimport { CdkPortal, DomPortalOutlet } from \"@angular/cdk/portal\";\r\nimport * as uuid from \"uuid\";\r\nimport { SdLoadingService } from \"@sd-angular/core/loading\";\r\n\r\n@Component({\r\n  selector: \"sd-side-drawer\",\r\n  templateUrl: \"./side-drawer.component.html\",\r\n  styleUrls: [\"./side-drawer.component.scss\"],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdSideDrawer implements AfterViewInit, OnDestroy {\r\n  id = `I${uuid.v4()}`;\r\n  @ViewChild(CdkPortal) portal: CdkPortal;\r\n  @Input() title: string;\r\n  @Input() editable: boolean;\r\n  @Input() width = \"480px\";\r\n  noCloseButton = false;\r\n  @Input('noCloseButton') set _noCloseButton(val: boolean | '') {\r\n    this.noCloseButton = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  noCloseClickOutSide = false;\r\n  @Input('noCloseClickOutSide') set _noCloseClickOutSide(val: boolean | '') {\r\n    this.noCloseClickOutSide = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  @Output() editingChanged = new EventEmitter<boolean>();\r\n  #embeddedViewRef: EmbeddedViewRef<any>;\r\n  isEditing: boolean = false;\r\n  isOpened = false;\r\n  alreadyOpen = false;\r\n  isHover = false;\r\n  isLoading = false;\r\n\r\n  constructor(\r\n    private cfr: ComponentFactoryResolver,\r\n    private ar: ApplicationRef,\r\n    private injector: Injector,\r\n    private ref: ChangeDetectorRef,\r\n    private loadingService: SdLoadingService\r\n  ) {}\r\n\r\n  ngAfterViewInit() {\r\n    this.#embeddedViewRef = new DomPortalOutlet(\r\n      document.body,\r\n      this.cfr,\r\n      this.ar,\r\n      this.injector\r\n    ).attachTemplatePortal(this.portal);\r\n  }\r\n\r\n  open = () => {\r\n    this.ref.markForCheck();\r\n    this.isOpened = true;\r\n    this.alreadyOpen = true;\r\n  };\r\n\r\n  close = () => {\r\n    this.ref.markForCheck();\r\n    this.isOpened = false;\r\n    this.stopLoading();\r\n  };\r\n\r\n  startLoading = () => {\r\n    this.isLoading = true;\r\n    this.loadingService.stop(`#${this.id}`);\r\n    this.loadingService.start(`#${this.id}`);\r\n  };\r\n\r\n  stopLoading = () => {\r\n    this.isLoading = false;\r\n    this.loadingService.stop(`#${this.id}`);\r\n  };\r\n\r\n  ngOnDestroy() {\r\n    this.#embeddedViewRef.destroy();\r\n  }\r\n\r\n  toggleEditable() {\r\n    this.isEditing = !this.isEditing;\r\n    this.editingChanged.emit(this.isEditing);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatDialogModule } from '@angular/material/dialog';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { SdButtonModule } from '@sd-angular/core/button';\r\nimport { SdSideDrawer } from './side-drawer/side-drawer.component';\r\nimport { PortalModule } from '@angular/cdk/portal';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    MatIconModule,\r\n    MatDialogModule,\r\n    MatButtonModule,\r\n    SdButtonModule,\r\n    PortalModule\r\n  ],\r\n  declarations: [\r\n    SdSideDrawer\r\n  ],\r\n  exports: [\r\n    SdSideDrawer\r\n  ],\r\n  providers: [\r\n  ]\r\n})\r\nexport class SdSideDrawerModule {\r\n\r\n}\r\n","/*\r\n * Public API Surface of superdev-angular-core\r\n */\r\n\r\nexport * from './lib/side-drawer/side-drawer.component';\r\n\r\nexport * from './lib/side-drawer.module';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":";;;;;;;;;;;;MAyBa,YAAY;IAwBvB,YACU,GAA6B,EAC7B,EAAkB,EAClB,QAAkB,EAClB,GAAsB,EACtB,cAAgC;QAJhC,QAAG,GAAH,GAAG,CAA0B;QAC7B,OAAE,GAAF,EAAE,CAAgB;QAClB,aAAQ,GAAR,QAAQ,CAAU;QAClB,QAAG,GAAH,GAAG,CAAmB;QACtB,mBAAc,GAAd,cAAc,CAAkB;QA5B1C,OAAE,GAAG,IAAIA,EAAO,EAAE,EAAE,CAAC;QAIZ,UAAK,GAAG,OAAO,CAAC;QACzB,kBAAa,GAAG,KAAK,CAAC;QAKtB,wBAAmB,GAAG,KAAK,CAAC;QAKlB,mBAAc,GAAG,IAAI,YAAY,EAAW,CAAC;QACvD,mCAAuC;QACvC,cAAS,GAAY,KAAK,CAAC;QAC3B,aAAQ,GAAG,KAAK,CAAC;QACjB,gBAAW,GAAG,KAAK,CAAC;QACpB,YAAO,GAAG,KAAK,CAAC;QAChB,cAAS,GAAG,KAAK,CAAC;QAmBlB,SAAI,GAAG;YACL,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACrB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;SACzB,CAAC;QAEF,UAAK,GAAG;YACN,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB,CAAC;QAEF,iBAAY,GAAG;YACb,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;YACxC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;SAC1C,CAAC;QAEF,gBAAW,GAAG;YACZ,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;SACzC,CAAC;KAhCE;IAvBJ,IAA4B,cAAc,CAAC,GAAiB;QAC1D,IAAI,CAAC,aAAa,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;QACzC,GAAG,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;KAC3B;IAED,IAAkC,oBAAoB,CAAC,GAAiB;QACtE,IAAI,CAAC,mBAAmB,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;QAC/C,GAAG,GAAG,CAAC,GAAG,KAAK,EAAE,KAAK,GAAG,CAAC;KAC3B;IAiBD,eAAe;QACb,uBAAA,IAAI,oBAAoB,IAAI,eAAe,CACzC,QAAQ,CAAC,IAAI,EACb,IAAI,CAAC,GAAG,EACR,IAAI,CAAC,EAAE,EACP,IAAI,CAAC,QAAQ,CACd,CAAC,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,EAAC;KACrC;IAyBD,WAAW;QACT,+CAAsB,OAAO,EAAE,CAAC;KACjC;IAED,cAAc;QACZ,IAAI,CAAC,SAAS,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;QACjC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;KAC1C;;;;YA7EF,SAAS,SAAC;gBACT,QAAQ,EAAE,gBAAgB;gBAC1B,q7CAA2C;gBAE3C,eAAe,EAAE,uBAAuB,CAAC,MAAM;;aAChD;;;YArBC,wBAAwB;YACxB,cAAc;YACd,QAAQ;YAQR,iBAAiB;YAIV,gBAAgB;;;qBAUtB,SAAS,SAAC,SAAS;oBACnB,KAAK;uBACL,KAAK;oBACL,KAAK;6BAEL,KAAK,SAAC,eAAe;mCAKrB,KAAK,SAAC,qBAAqB;6BAI3B,MAAM;;;MCbI,kBAAkB;;;YAlB9B,QAAQ,SAAC;gBACR,OAAO,EAAE;oBACP,YAAY;oBACZ,aAAa;oBACb,eAAe;oBACf,eAAe;oBACf,cAAc;oBACd,YAAY;iBACb;gBACD,YAAY,EAAE;oBACZ,YAAY;iBACb;gBACD,OAAO,EAAE;oBACP,YAAY;iBACb;gBACD,SAAS,EAAE,EACV;aACF;;;AC3BD;;;;ACAA;;;;;;"}
+{"version":3,"file":"sd-angular-core-side-drawer.js","sources":["../../../../projects/sd-core/side-drawer/src/lib/side-drawer/side-drawer.component.ts","../../../../projects/sd-core/side-drawer/src/lib/side-drawer.module.ts","../../../../projects/sd-core/side-drawer/src/public-api.ts","../../../../projects/sd-core/side-drawer/sd-angular-core-side-drawer.ts"],"sourcesContent":["import {\r\n  Component,\r\n  ViewChild,\r\n  ComponentFactoryResolver,\r\n  ApplicationRef,\r\n  Injector,\r\n  EmbeddedViewRef,\r\n  AfterViewInit,\r\n  OnDestroy,\r\n  Input,\r\n  Output,\r\n  EventEmitter,\r\n  ChangeDetectionStrategy,\r\n  ChangeDetectorRef,\r\n} from \"@angular/core\";\r\nimport { CdkPortal, DomPortalOutlet } from \"@angular/cdk/portal\";\r\nimport * as uuid from \"uuid\";\r\nimport { SdLoadingService } from \"@sd-angular/core/loading\";\r\n\r\n@Component({\r\n  selector: \"sd-side-drawer\",\r\n  templateUrl: \"./side-drawer.component.html\",\r\n  styleUrls: [\"./side-drawer.component.scss\"],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdSideDrawer implements AfterViewInit, OnDestroy {\r\n  id = `I${uuid.v4()}`;\r\n  @ViewChild(CdkPortal) portal: CdkPortal;\r\n  @Input() title: string;\r\n  @Input() editable: boolean;\r\n  @Input() width = \"480px\";\r\n  noCloseButton = false;\r\n  @Input('noCloseButton') set _noCloseButton(val: boolean | '') {\r\n    this.noCloseButton = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  noCloseClickOutSide = false;\r\n  @Input('noCloseClickOutSide') set _noCloseClickOutSide(val: boolean | '') {\r\n    this.noCloseClickOutSide = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  alwaysDisplayBackDrop = false;\r\n  @Input('alwaysDisplayBackDrop') set _alwaysDisplayBackDrop(val: boolean | '') {\r\n    this.alwaysDisplayBackDrop = (val === '') || val;\r\n    val = (val === '') || val;\r\n  }\r\n  @Output() editingChanged = new EventEmitter<boolean>();\r\n  #embeddedViewRef: EmbeddedViewRef<any>;\r\n  isEditing: boolean = false;\r\n  isOpened = false;\r\n  alreadyOpen = false;\r\n  isHover = false;\r\n  isLoading = false;\r\n\r\n  constructor(\r\n    private cfr: ComponentFactoryResolver,\r\n    private ar: ApplicationRef,\r\n    private injector: Injector,\r\n    private ref: ChangeDetectorRef,\r\n    private loadingService: SdLoadingService\r\n  ) {}\r\n\r\n  ngAfterViewInit() {\r\n    this.#embeddedViewRef = new DomPortalOutlet(\r\n      document.body,\r\n      this.cfr,\r\n      this.ar,\r\n      this.injector\r\n    ).attachTemplatePortal(this.portal);\r\n  }\r\n\r\n  open = () => {\r\n    this.ref.markForCheck();\r\n    this.isOpened = true;\r\n    this.alreadyOpen = true;\r\n  };\r\n\r\n  close = () => {\r\n    this.ref.markForCheck();\r\n    this.isOpened = false;\r\n    this.stopLoading();\r\n  };\r\n\r\n  startLoading = () => {\r\n    this.isLoading = true;\r\n    this.loadingService.stop(`#${this.id}`);\r\n    this.loadingService.start(`#${this.id}`);\r\n  };\r\n\r\n  stopLoading = () => {\r\n    this.isLoading = false;\r\n    this.loadingService.stop(`#${this.id}`);\r\n  };\r\n\r\n  ngOnDestroy() {\r\n    this.#embeddedViewRef.destroy();\r\n  }\r\n\r\n  toggleEditable() {\r\n    this.isEditing = !this.isEditing;\r\n    this.editingChanged.emit(this.isEditing);\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\n\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatDialogModule } from '@angular/material/dialog';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { SdButtonModule } from '@sd-angular/core/button';\r\nimport { SdSideDrawer } from './side-drawer/side-drawer.component';\r\nimport { PortalModule } from '@angular/cdk/portal';\r\n\r\n@NgModule({\r\n  imports: [\r\n    CommonModule,\r\n    MatIconModule,\r\n    MatDialogModule,\r\n    MatButtonModule,\r\n    SdButtonModule,\r\n    PortalModule\r\n  ],\r\n  declarations: [\r\n    SdSideDrawer\r\n  ],\r\n  exports: [\r\n    SdSideDrawer\r\n  ],\r\n  providers: [\r\n  ]\r\n})\r\nexport class SdSideDrawerModule {\r\n\r\n}\r\n","/*\r\n * Public API Surface of superdev-angular-core\r\n */\r\n\r\nexport * from './lib/side-drawer/side-drawer.component';\r\n\r\nexport * from './lib/side-drawer.module';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["uuid.v4"],"mappings":"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"}

package/grid-material/src/lib/models/grid-column.model.d.ts

@@ -101,7 +101,7 @@ export interface SdGridMaterialColumnValues<T = any> extends SdGridMaterialBaseC
     badgeIcon?: (value: any, rowData: T) => string;
     badgeType?: 'circle' | 'icon';
     option: {
-        items: any[] | ((searchText?: string | string[], isFormValue?: boolean) => Promise<any[]>);
+        items: any[] | ((searchText?: string, isFormValue?: boolean) => Promise<any[]>) | ((searchText?: string[], isFormValue?: boolean) => Promise<any[]>);
         valueField: string;
         displayField: string;
         selection?: 'AUTOCOMPLETE' | 'MULTIPLE' | 'MULTIPLEAUTOCOMPLETE' | 'AUTOCOMPLETE_EDITOR' | 'MULTIPLE_EDITOR' | 'MULTIPLEAUTOCOMPLETE_EDITOR';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sd-angular/core",
-  "version": "1.3.128",
+  "version": "1.3.129",
   "homepage": "https://www.facebook.com/DarkP3ter",
   "author": {
     "name": "darkpeter",

package/side-drawer/sd-angular-core-side-drawer.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"SdSideDrawer":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"sd-side-drawer","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":19},"member":"OnPush"},"template":"<ng-template cdkPortal>\r\n  <div [id]=\"id\" class=\"side-drawer\" [ngStyle]=\"{'width': width}\" [ngClass]=\"{'side-drawer--active': isOpened,'side-drawer--loading': isLoading}\"\r\n    (mouseover)=\"isHover = true\" (mouseout)=\"isHover = false\">\r\n    <ng-container *ngIf=\"isOpened\">\r\n      <div class=\"side-drawer__header media align-items-center\">\r\n        <div class=\"side-drawer__title media-body\">\r\n          <ng-content select=\"[sdTitle]\"></ng-content>\r\n        </div>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"toggleEditable()\" *ngIf=\"editable\" mat-icon-button>\r\n          <mat-icon>edit</mat-icon>\r\n        </button>\r\n        <button *ngIf=\"!noCloseButton\" type=\"button\" class=\"c-action\" (click)=\"close()\" mat-icon-button>\r\n          <mat-icon>close</mat-icon>\r\n        </button>\r\n      </div>\r\n      <div *ngIf=\"isOpened\" class=\"side-drawer__body\">\r\n        <div class=\"side-drawer__content\">\r\n          <ng-content select=\"[sdBody]\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"side-drawer__footer\">\r\n        <ng-content select=\"[sdFooter]\"></ng-content>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <button *ngIf=\"isOpened\" type=\"button\" class=\"side-drawer-backdrop\" (click)=\"noCloseClickOutSide? null: close()\"\r\n    [ngClass]=\"{ 'side-drawer-backdrop--active': isHover }\"></button>\r\n</ng-template>\r\n","styles":[".text-black400{color:#757575}.side-drawer{background-color:#fff;bottom:0;box-shadow:0 .4px .8px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.2);display:flex;flex-direction:column;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transform:translate3d(100%,0,0);transition:all .3s ease-in-out;visibility:hidden;z-index:999}.c-action{color:#212121}.c-action:focus{outline:none}.side-drawer__icon{background:transparent;border:0;color:#212121;outline:none;overflow:hidden}.side-drawer__icon .mat-icon{float:left}.side-drawer__header{min-height:64px;padding:12px 16px}.side-drawer__body{flex:1;position:relative}.side-drawer__content{bottom:0;left:0;overflow:auto;padding:0 16px 16px;position:absolute;right:0;top:0}.side-drawer__footer{border-top:1px solid #dde0e5;padding:8px 0}.side-drawer-backdrop{background:none;border:0;bottom:0;height:100%;left:0;outline:none!important;position:fixed;right:0;top:0;transition:all .3s ease-in-out;width:100%;z-index:99}.side-drawer-backdrop--active{background-color:rgba(0,0,0,.4)}.side-drawer--active{opacity:1;pointer-events:all;transform:translateZ(0);visibility:visible}.side-drawer__title{font-size:20px;font-weight:500;line-height:28px}"]}]}],"members":{"portal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":27,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/cdk/portal","name":"CdkPortal","line":27,"character":13}]}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"_noCloseButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3},"arguments":["noCloseButton"]}]}],"_noCloseClickOutSide":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3},"arguments":["noCloseClickOutSide"]}]}],"editingChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":41,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":50,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":51,"character":16},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":52,"character":22},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":53,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/loading","name":"SdLoadingService","line":54,"character":28}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"toggleEditable":[{"__symbolic":"method"}]}},"SdSideDrawerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialogModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":15,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/button","name":"SdButtonModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":17,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSideDrawer"}],"exports":[{"__symbolic":"reference","name":"SdSideDrawer"}],"providers":[]}]}],"members":{}}},"origins":{"SdSideDrawer":"./src/lib/side-drawer/side-drawer.component","SdSideDrawerModule":"./src/lib/side-drawer.module"},"importAs":"@sd-angular/core/side-drawer"}
+{"__symbolic":"module","version":4,"metadata":{"SdSideDrawer":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"sd-side-drawer","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":19},"member":"OnPush"},"template":"<ng-template cdkPortal>\r\n  <div [id]=\"id\" class=\"side-drawer\" [ngStyle]=\"{'width': width}\" [ngClass]=\"{'side-drawer--active': isOpened,'side-drawer--loading': isLoading}\"\r\n    (mouseover)=\"isHover = true\" (mouseout)=\"isHover = false\">\r\n    <ng-container *ngIf=\"isOpened\">\r\n      <div class=\"side-drawer__header media align-items-center\">\r\n        <div class=\"side-drawer__title media-body\">\r\n          <ng-content select=\"[sdTitle]\"></ng-content>\r\n        </div>\r\n        <button type=\"button\" class=\"c-action\" (click)=\"toggleEditable()\" *ngIf=\"editable\" mat-icon-button>\r\n          <mat-icon>edit</mat-icon>\r\n        </button>\r\n        <button *ngIf=\"!noCloseButton\" type=\"button\" class=\"c-action\" (click)=\"close()\" mat-icon-button>\r\n          <mat-icon>close</mat-icon>\r\n        </button>\r\n      </div>\r\n      <div *ngIf=\"isOpened\" class=\"side-drawer__body\">\r\n        <div class=\"side-drawer__content\">\r\n          <ng-content select=\"[sdBody]\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"side-drawer__footer\">\r\n        <ng-content select=\"[sdFooter]\"></ng-content>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n  <button *ngIf=\"isOpened\" type=\"button\" class=\"side-drawer-backdrop\" (click)=\"noCloseClickOutSide? null: close()\"\r\n    [ngClass]=\"{ 'side-drawer-backdrop--active': !alwaysDisplayBackDrop? isHover: true }\"></button>\r\n</ng-template>\r\n","styles":[".text-black400{color:#757575}.side-drawer{background-color:#fff;bottom:0;box-shadow:0 .4px .8px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.2);display:flex;flex-direction:column;opacity:0;pointer-events:none;position:fixed;right:0;top:0;transform:translate3d(100%,0,0);transition:all .3s ease-in-out;visibility:hidden;z-index:999}.c-action{color:#212121}.c-action:focus{outline:none}.side-drawer__icon{background:transparent;border:0;color:#212121;outline:none;overflow:hidden}.side-drawer__icon .mat-icon{float:left}.side-drawer__header{min-height:64px;padding:12px 16px}.side-drawer__body{flex:1;position:relative}.side-drawer__content{bottom:0;left:0;overflow:auto;padding:0 16px 16px;position:absolute;right:0;top:0}.side-drawer__footer{border-top:1px solid #dde0e5;padding:8px 0}.side-drawer-backdrop{background:none;border:0;bottom:0;height:100%;left:0;outline:none!important;position:fixed;right:0;top:0;transition:all .3s ease-in-out;width:100%;z-index:99}.side-drawer-backdrop--active{background-color:rgba(0,0,0,.4)}.side-drawer--active{opacity:1;pointer-events:all;transform:translateZ(0);visibility:visible}.side-drawer__title{font-size:20px;font-weight:500;line-height:28px}"]}]}],"members":{"portal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":27,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/cdk/portal","name":"CdkPortal","line":27,"character":13}]}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"editable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"width":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"_noCloseButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3},"arguments":["noCloseButton"]}]}],"_noCloseClickOutSide":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3},"arguments":["noCloseClickOutSide"]}]}],"_alwaysDisplayBackDrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3},"arguments":["alwaysDisplayBackDrop"]}]}],"editingChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":46,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ComponentFactoryResolver","line":55,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"ApplicationRef","line":56,"character":16},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":57,"character":22},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":58,"character":17},{"__symbolic":"reference","module":"@sd-angular/core/loading","name":"SdLoadingService","line":59,"character":28}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"toggleEditable":[{"__symbolic":"method"}]}},"SdSideDrawerModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialogModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":15,"character":4},{"__symbolic":"reference","module":"@sd-angular/core/button","name":"SdButtonModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":17,"character":4}],"declarations":[{"__symbolic":"reference","name":"SdSideDrawer"}],"exports":[{"__symbolic":"reference","name":"SdSideDrawer"}],"providers":[]}]}],"members":{}}},"origins":{"SdSideDrawer":"./src/lib/side-drawer/side-drawer.component","SdSideDrawerModule":"./src/lib/side-drawer.module"},"importAs":"@sd-angular/core/side-drawer"}

package/side-drawer/src/lib/side-drawer/side-drawer.component.d.ts

@@ -17,6 +17,8 @@ export declare class SdSideDrawer implements AfterViewInit, OnDestroy {
     set _noCloseButton(val: boolean | '');
     noCloseClickOutSide: boolean;
     set _noCloseClickOutSide(val: boolean | '');
+    alwaysDisplayBackDrop: boolean;
+    set _alwaysDisplayBackDrop(val: boolean | '');
     editingChanged: EventEmitter<boolean>;
     isEditing: boolean;
     isOpened: boolean;