ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
16 lines (14 loc) • 18.2 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/cdk/a11y"),require("@angular/cdk/bidi"),require("@angular/cdk/keycodes"),require("@angular/cdk/overlay"),require("@angular/cdk/portal"),require("@angular/common"),require("@angular/core"),require("rxjs"),require("rxjs/operators"),require("ng-zorro-antd/core/config"),require("ng-zorro-antd/core/logger"),require("ng-zorro-antd/core/util"),require("ng-zorro-antd/core/no-animation"),require("ng-zorro-antd/core/outlet"),require("ng-zorro-antd/icon")):"function"==typeof define&&define.amd?define("ng-zorro-antd/drawer",["exports","@angular/cdk/a11y","@angular/cdk/bidi","@angular/cdk/keycodes","@angular/cdk/overlay","@angular/cdk/portal","@angular/common","@angular/core","rxjs","rxjs/operators","ng-zorro-antd/core/config","ng-zorro-antd/core/logger","ng-zorro-antd/core/util","ng-zorro-antd/core/no-animation","ng-zorro-antd/core/outlet","ng-zorro-antd/icon"],t):t(((e="undefined"!=typeof globalThis?globalThis:e||self)["ng-zorro-antd"]=e["ng-zorro-antd"]||{},e["ng-zorro-antd"].drawer={}),e.ng.cdk.a11y,e.ng.cdk.bidi,e.ng.cdk.keycodes,e.ng.cdk.overlay,e.ng.cdk.portal,e.ng.common,e.ng.core,e.rxjs,e.rxjs.operators,e["ng-zorro-antd"].core.config,e["ng-zorro-antd"].core.logger,e["ng-zorro-antd"].core.util,e["ng-zorro-antd"].core["no-animation"],e["ng-zorro-antd"].core.outlet,e["ng-zorro-antd"].icon)}(this,(function(e,t,n,o,r,i,a,s,l,c,p,u,d,f,y,h){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */var g=function(e,t){return(g=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])})(e,t)};function m(e,t,n,o){var r,i=arguments.length,a=i<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,o);else for(var s=e.length-1;s>=0;s--)(r=e[s])&&(a=(i<3?r(a):i>3?r(t,n,a):r(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}function v(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}Object.create;Object.create;var z=function(e){this.templateRef=e};z.decorators=[{type:s.Directive,args:[{selector:"[nzDrawerContent]",exportAs:"nzDrawerContent"}]}],z.ctorParameters=function(){return[{type:s.TemplateRef}]};var C=function(){},b=function(e){function t(t,n,o,r,i,a,c,p,u,d,f){var y=e.call(this)||this;return y.cdr=t,y.document=n,y.nzConfigService=o,y.renderer=r,y.overlay=i,y.injector=a,y.changeDetectorRef=c,y.focusTrapFactory=p,y.viewContainerRef=u,y.overlayKeyboardDispatcher=d,y.directionality=f,y._nzModuleName="drawer",y.nzCloseIcon="close",y.nzClosable=!0,y.nzMaskClosable=!0,y.nzMask=!0,y.nzCloseOnNavigation=!0,y.nzNoAnimation=!1,y.nzKeyboard=!0,y.nzPlacement="right",y.nzMaskStyle={},y.nzBodyStyle={},y.nzWidth=256,y.nzHeight=256,y.nzZIndex=1e3,y.nzOffsetX=0,y.nzOffsetY=0,y.componentInstance=null,y.nzOnViewInit=new s.EventEmitter,y.nzOnClose=new s.EventEmitter,y.nzVisibleChange=new s.EventEmitter,y.destroy$=new l.Subject,y.placementChanging=!1,y.placementChangeTimeoutId=-1,y.isOpen=!1,y.templateContext={$implicit:void 0,drawerRef:y},y.nzAfterOpen=new l.Subject,y.nzAfterClose=new l.Subject,y.nzDirection=void 0,y.dir="ltr",y}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}g(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}(t,e),Object.defineProperty(t.prototype,"nzVisible",{get:function(){return this.isOpen},set:function(e){this.isOpen=e},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"offsetTransform",{get:function(){if(!this.isOpen||this.nzOffsetX+this.nzOffsetY===0)return null;switch(this.nzPlacement){case"left":return"translateX("+this.nzOffsetX+"px)";case"right":return"translateX(-"+this.nzOffsetX+"px)";case"top":return"translateY("+this.nzOffsetY+"px)";case"bottom":return"translateY(-"+this.nzOffsetY+"px)"}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"transform",{get:function(){if(this.isOpen)return null;switch(this.nzPlacement){case"left":return"translateX(-100%)";case"right":return"translateX(100%)";case"top":return"translateY(-100%)";case"bottom":return"translateY(100%)"}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"width",{get:function(){return this.isLeftOrRight?d.toCssPixel(this.nzWidth):null},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"height",{get:function(){return this.isLeftOrRight?null:d.toCssPixel(this.nzHeight)},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"isLeftOrRight",{get:function(){return"left"===this.nzPlacement||"right"===this.nzPlacement},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"afterOpen",{get:function(){return this.nzAfterOpen.asObservable()},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"afterClose",{get:function(){return this.nzAfterClose.asObservable()},enumerable:!1,configurable:!0}),t.prototype.isTemplateRef=function(e){return e instanceof s.TemplateRef},t.prototype.ngOnInit=function(){var e,t=this;null===(e=this.directionality.change)||void 0===e||e.pipe(c.takeUntil(this.destroy$)).subscribe((function(e){t.dir=e,t.cdr.detectChanges()})),this.dir=this.nzDirection||this.directionality.value,this.attachOverlay(),this.updateOverlayStyle(),this.updateBodyOverflow(),this.templateContext={$implicit:this.nzContentParams,drawerRef:this},this.changeDetectorRef.detectChanges()},t.prototype.ngAfterViewInit=function(){var e=this;this.attachBodyContent(),setTimeout((function(){e.nzOnViewInit.emit()}))},t.prototype.ngAfterContentInit=function(){this.contentFromContentChild||this.nzContent||u.warnDeprecation("Usage `<ng-content></ng-content>` is deprecated, which will be removed in 12.0.0. Please instead use `<ng-template nzDrawerContent></ng-template>` to declare the content of the drawer.")},t.prototype.ngOnChanges=function(e){var t=e.nzPlacement;e.nzVisible&&(e.nzVisible.currentValue?this.open():this.close());t&&!t.isFirstChange()&&this.triggerPlacementChangeCycleOnce()},t.prototype.ngOnDestroy=function(){this.destroy$.next(),this.destroy$.complete(),clearTimeout(this.placementChangeTimeoutId),this.disposeOverlay()},t.prototype.getAnimationDuration=function(){return this.nzNoAnimation?0:300},t.prototype.triggerPlacementChangeCycleOnce=function(){var e=this;this.nzNoAnimation||(this.placementChanging=!0,this.changeDetectorRef.markForCheck(),clearTimeout(this.placementChangeTimeoutId),this.placementChangeTimeoutId=setTimeout((function(){e.placementChanging=!1,e.changeDetectorRef.markForCheck()}),this.getAnimationDuration()))},t.prototype.close=function(e){var t=this;this.isOpen=!1,this.nzVisibleChange.emit(!1),this.updateOverlayStyle(),this.overlayKeyboardDispatcher.remove(this.overlayRef),this.changeDetectorRef.detectChanges(),setTimeout((function(){t.updateBodyOverflow(),t.restoreFocus(),t.nzAfterClose.next(e),t.nzAfterClose.complete(),t.componentInstance=null}),this.getAnimationDuration())},t.prototype.open=function(){var e=this;this.attachOverlay(),this.isOpen=!0,this.nzVisibleChange.emit(!0),this.overlayKeyboardDispatcher.add(this.overlayRef),this.updateOverlayStyle(),this.updateBodyOverflow(),this.savePreviouslyFocusedElement(),this.trapFocus(),this.changeDetectorRef.detectChanges(),setTimeout((function(){e.nzAfterOpen.next()}),this.getAnimationDuration())},t.prototype.getContentComponent=function(){return this.componentInstance},t.prototype.closeClick=function(){this.nzOnClose.emit()},t.prototype.maskClick=function(){this.nzMaskClosable&&this.nzMask&&this.nzOnClose.emit()},t.prototype.attachBodyContent=function(){if(this.bodyPortalOutlet.dispose(),this.nzContent instanceof s.Type){var e=s.Injector.create({parent:this.injector,providers:[{provide:C,useValue:this}]}),t=new i.ComponentPortal(this.nzContent,null,e),n=this.bodyPortalOutlet.attachComponentPortal(t);this.componentInstance=n.instance,Object.assign(n.instance,this.nzContentParams),n.changeDetectorRef.detectChanges()}},t.prototype.attachOverlay=function(){var e=this;this.overlayRef||(this.portal=new i.TemplatePortal(this.drawerTemplate,this.viewContainerRef),this.overlayRef=this.overlay.create(this.getOverlayConfig())),this.overlayRef&&!this.overlayRef.hasAttached()&&(this.overlayRef.attach(this.portal),this.overlayRef.keydownEvents().pipe(c.takeUntil(this.destroy$)).subscribe((function(t){t.keyCode===o.ESCAPE&&e.isOpen&&e.nzKeyboard&&e.nzOnClose.emit()})),this.overlayRef.detachments().pipe(c.takeUntil(this.destroy$)).subscribe((function(){e.disposeOverlay()})))},t.prototype.disposeOverlay=function(){var e;null===(e=this.overlayRef)||void 0===e||e.dispose(),this.overlayRef=null},t.prototype.getOverlayConfig=function(){return new r.OverlayConfig({disposeOnNavigation:this.nzCloseOnNavigation,positionStrategy:this.overlay.position().global(),scrollStrategy:this.overlay.scrollStrategies.block()})},t.prototype.updateOverlayStyle=function(){this.overlayRef&&this.overlayRef.overlayElement&&this.renderer.setStyle(this.overlayRef.overlayElement,"pointer-events",this.isOpen?"auto":"none")},t.prototype.updateBodyOverflow=function(){this.overlayRef&&(this.isOpen?this.overlayRef.getConfig().scrollStrategy.enable():this.overlayRef.getConfig().scrollStrategy.disable())},t.prototype.savePreviouslyFocusedElement=function(){this.document&&!this.previouslyFocusedElement&&(this.previouslyFocusedElement=this.document.activeElement,this.previouslyFocusedElement&&"function"==typeof this.previouslyFocusedElement.blur&&this.previouslyFocusedElement.blur())},t.prototype.trapFocus=function(){!this.focusTrap&&this.overlayRef&&this.overlayRef.overlayElement&&(this.focusTrap=this.focusTrapFactory.create(this.overlayRef.overlayElement),this.focusTrap.focusInitialElement())},t.prototype.restoreFocus=function(){this.previouslyFocusedElement&&"function"==typeof this.previouslyFocusedElement.focus&&this.previouslyFocusedElement.focus(),this.focusTrap&&this.focusTrap.destroy()},t}(C);b.decorators=[{type:s.Component,args:[{selector:"nz-drawer",exportAs:"nzDrawer",template:'\n <ng-template #drawerTemplate>\n <div\n class="ant-drawer"\n [nzNoAnimation]="nzNoAnimation"\n [class.ant-drawer-rtl]="dir === \'rtl\'"\n [class.ant-drawer-open]="isOpen"\n [class.no-mask]="!nzMask"\n [class.ant-drawer-top]="nzPlacement === \'top\'"\n [class.ant-drawer-bottom]="nzPlacement === \'bottom\'"\n [class.ant-drawer-right]="nzPlacement === \'right\'"\n [class.ant-drawer-left]="nzPlacement === \'left\'"\n [style.transform]="offsetTransform"\n [style.transition]="placementChanging ? \'none\' : null"\n [style.zIndex]="nzZIndex"\n >\n <div class="ant-drawer-mask" (click)="maskClick()" *ngIf="nzMask" [ngStyle]="nzMaskStyle"></div>\n <div\n class="ant-drawer-content-wrapper {{ nzWrapClassName }}"\n [style.width]="width"\n [style.height]="height"\n [style.transform]="transform"\n [style.transition]="placementChanging ? \'none\' : null"\n >\n <div class="ant-drawer-content">\n <div class="ant-drawer-wrapper-body" [style.height]="isLeftOrRight ? \'100%\' : null">\n <div *ngIf="nzTitle || nzClosable" [class.ant-drawer-header]="!!nzTitle" [class.ant-drawer-header-no-title]="!nzTitle">\n <div *ngIf="nzTitle" class="ant-drawer-title">\n <ng-container *nzStringTemplateOutlet="nzTitle"><div [innerHTML]="nzTitle"></div></ng-container>\n </div>\n <button *ngIf="nzClosable" (click)="closeClick()" aria-label="Close" class="ant-drawer-close" style="--scroll-bar: 0px;">\n <ng-container *nzStringTemplateOutlet="nzCloseIcon; let closeIcon">\n <i nz-icon [nzType]="closeIcon"></i>\n </ng-container>\n </button>\n </div>\n <div class="ant-drawer-body" [ngStyle]="nzBodyStyle">\n <ng-template cdkPortalOutlet></ng-template>\n <ng-container *ngIf="nzContent; else contentElseTemp">\n <ng-container *ngIf="isTemplateRef(nzContent)">\n <ng-container *ngTemplateOutlet="$any(nzContent); context: templateContext"></ng-container>\n </ng-container>\n </ng-container>\n <ng-template #contentElseTemp>\n <ng-container *ngIf="contentFromContentChild">\n <ng-template [ngTemplateOutlet]="contentFromContentChild"></ng-template>\n </ng-container>\n </ng-template>\n <ng-content *ngIf="!(nzContent || contentFromContentChild)"></ng-content>\n </div>\n <div *ngIf="nzFooter" class="ant-drawer-footer">\n <ng-container *nzStringTemplateOutlet="nzFooter"><div [innerHTML]="nzFooter"></div></ng-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n ',preserveWhitespaces:!1,changeDetection:s.ChangeDetectionStrategy.OnPush}]}],b.ctorParameters=function(){return[{type:s.ChangeDetectorRef},{type:void 0,decorators:[{type:s.Optional},{type:s.Inject,args:[a.DOCUMENT]}]},{type:p.NzConfigService},{type:s.Renderer2},{type:r.Overlay},{type:s.Injector},{type:s.ChangeDetectorRef},{type:t.FocusTrapFactory},{type:s.ViewContainerRef},{type:r.OverlayKeyboardDispatcher},{type:n.Directionality,decorators:[{type:s.Optional}]}]},b.propDecorators={nzContent:[{type:s.Input}],nzCloseIcon:[{type:s.Input}],nzClosable:[{type:s.Input}],nzMaskClosable:[{type:s.Input}],nzMask:[{type:s.Input}],nzCloseOnNavigation:[{type:s.Input}],nzNoAnimation:[{type:s.Input}],nzKeyboard:[{type:s.Input}],nzTitle:[{type:s.Input}],nzFooter:[{type:s.Input}],nzPlacement:[{type:s.Input}],nzMaskStyle:[{type:s.Input}],nzBodyStyle:[{type:s.Input}],nzWrapClassName:[{type:s.Input}],nzWidth:[{type:s.Input}],nzHeight:[{type:s.Input}],nzZIndex:[{type:s.Input}],nzOffsetX:[{type:s.Input}],nzOffsetY:[{type:s.Input}],nzVisible:[{type:s.Input}],nzOnViewInit:[{type:s.Output}],nzOnClose:[{type:s.Output}],nzVisibleChange:[{type:s.Output}],drawerTemplate:[{type:s.ViewChild,args:["drawerTemplate",{static:!0}]}],bodyPortalOutlet:[{type:s.ViewChild,args:[i.CdkPortalOutlet,{static:!1}]}],contentFromContentChild:[{type:s.ContentChild,args:[z,{static:!0,read:s.TemplateRef}]}]},m([d.InputBoolean(),v("design:type",Boolean)],b.prototype,"nzClosable",void 0),m([p.WithConfig(),d.InputBoolean(),v("design:type",Boolean)],b.prototype,"nzMaskClosable",void 0),m([p.WithConfig(),d.InputBoolean(),v("design:type",Boolean)],b.prototype,"nzMask",void 0),m([p.WithConfig(),d.InputBoolean(),v("design:type",Boolean)],b.prototype,"nzCloseOnNavigation",void 0),m([d.InputBoolean(),v("design:type",Object)],b.prototype,"nzNoAnimation",void 0),m([d.InputBoolean(),v("design:type",Boolean)],b.prototype,"nzKeyboard",void 0),m([p.WithConfig(),v("design:type",String)],b.prototype,"nzDirection",void 0);var O=function(){};O.decorators=[{type:s.NgModule}];var w=function(){};w.decorators=[{type:s.NgModule,args:[{imports:[n.BidiModule,a.CommonModule,r.OverlayModule,i.PortalModule,h.NzIconModule,y.NzOutletModule,f.NzNoAnimationModule,O],exports:[b,z],declarations:[b,z],entryComponents:[b]}]}];var I=function(){function e(e,t){var n=this;this.overlay=e,this.options=t,this.unsubscribe$=new l.Subject;var o=this.options,r=o.nzOnCancel,a=function(e,t){var n={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(o=Object.getOwnPropertySymbols(e);r<o.length;r++)t.indexOf(o[r])<0&&Object.prototype.propertyIsEnumerable.call(e,o[r])&&(n[o[r]]=e[o[r]])}return n}(o,["nzOnCancel"]);this.overlayRef=this.overlay.create(),this.drawerRef=this.overlayRef.attach(new i.ComponentPortal(b)).instance,this.updateOptions(a),this.drawerRef.savePreviouslyFocusedElement(),this.drawerRef.nzOnViewInit.pipe(c.takeUntil(this.unsubscribe$)).subscribe((function(){n.drawerRef.open()})),this.drawerRef.nzOnClose.subscribe((function(){r?r().then((function(e){!1!==e&&n.drawerRef.close()})):n.drawerRef.close()})),this.drawerRef.afterClose.pipe(c.takeUntil(this.unsubscribe$)).subscribe((function(){n.overlayRef.dispose(),n.drawerRef=null,n.unsubscribe$.next(),n.unsubscribe$.complete()}))}return e.prototype.getInstance=function(){return this.drawerRef},e.prototype.updateOptions=function(e){Object.assign(this.drawerRef,e)},e}(),R=function(){function e(e){this.overlay=e}return e.prototype.create=function(e){return new I(this.overlay,e).getInstance()},e}();R.ɵprov=s.ɵɵdefineInjectable({factory:function(){return new R(s.ɵɵinject(r.Overlay))},token:R,providedIn:O}),R.decorators=[{type:s.Injectable,args:[{providedIn:O}]}],R.ctorParameters=function(){return[{type:r.Overlay}]},e.DRAWER_ANIMATE_DURATION=300,e.DrawerBuilderForService=I,e.NzDrawerComponent=b,e.NzDrawerContentDirective=z,e.NzDrawerModule=w,e.NzDrawerRef=C,e.NzDrawerService=R,e.NzDrawerServiceModule=O,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=ng-zorro-antd-drawer.umd.min.js.map