UNPKG

@angular-mdc/web

Version:
22 lines (20 loc) 11.3 kB
/** * @license * Copyright (c) Dominic Carretto * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://github.com/trimox/angular-mdc-web/blob/master/LICENSE */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("@angular/cdk/a11y"),require("@angular/cdk/coercion"),require("@angular/cdk/platform"),require("rxjs"),require("rxjs/operators"),require("@angular-mdc/web/base"),require("@angular-mdc/web/list"),require("@material/drawer")):"function"==typeof define&&define.amd?define("@angular-mdc/web/drawer",["exports","@angular/core","@angular/common","@angular/cdk/a11y","@angular/cdk/coercion","@angular/cdk/platform","rxjs","rxjs/operators","@angular-mdc/web/base","@angular-mdc/web/list","@material/drawer"],t):t(((e=e||self).ng=e.ng||{},e.ng.web=e.ng.web||{},e.ng.web.drawer={}),e.ng.core,e.ng.common,e.ng.cdk.a11y,e.ng.cdk.coercion,e.ng.cdk.platform,e.rxjs,e.rxjs.operators,e.ng.web.base,e.ng.web.list,e.mdc.drawer)}(this,(function(e,t,n,r,o,s,i,a,c,u,l){"use strict"; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABLITY OR NON-INFRINGEMENT. See the Apache Version 2.0 License for specific language governing permissions and limitations under the License. ***************************************************************************** */var d=function(e,t){return(d=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n])})(e,t)};var p=function(){function e(e){this.elementRef=e}return e.decorators=[{type:t.Component,args:[{selector:"mdc-drawer-header",template:'\n <ng-content></ng-content>\n <h3 class="mdc-drawer__title" *ngIf="title">{{title}}</h3>\n <h6 class="mdc-drawer__subtitle" *ngIf="subtitle">{{subtitle}}</h6>',host:{class:"mdc-drawer__header"},changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None}]}],e.ctorParameters=function(){return[{type:t.ElementRef}]},e.propDecorators={title:[{type:t.Input}],subtitle:[{type:t.Input}]},e}(),m=function(e){function c(n,r,o,s,c,u,l){var d=e.call(this,l)||this;return d._platform=n,d._ngZone=r,d._changeDetectorRef=o,d._focusTrapFactory=s,d._focusMonitor=c,d._document=u,d.elementRef=l,d._destroyed=new i.Subject,d._scrimElement=null,d._elementFocusedBeforeDrawerWasOpened=null,d._open=!1,d._drawer="",d._autoFocus=!0,d._restoreFocus=!0,d.opened=new t.EventEmitter,d.closed=new t.EventEmitter,d.openedChange=new t.EventEmitter(!0),d.drawerChange=new t.EventEmitter(!0),d._scrimSubscription=null,d.openedChange.subscribe((function(e){e?(d._document&&(d._elementFocusedBeforeDrawerWasOpened=d._document.activeElement),d._isFocusTrapEnabled&&d._focusTrap&&d._trapFocus()):d._releaseFocus()})),d.drawerChange.subscribe((function(){return d._initFoundation()})),d._ngZone.runOutsideAngular((function(){i.fromEvent(d._elementRef.nativeElement,"keydown").pipe(a.takeUntil(d._destroyed)).subscribe((function(e){return d._ngZone.run((function(){d._foundation.handleKeydown(e),d.modal&&(e.stopPropagation(),e.preventDefault())}))}))})),d}return function(e,t){function n(){this.constructor=e}d(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}(c,e),Object.defineProperty(c.prototype,"open",{get:function(){return this._open},set:function(e){this._platform.isBrowser&&this._open!==e&&(this._open=o.coerceBooleanProperty(e),this._open?this._foundation.open():this._foundation.close(),this.openedChange.emit(this._open),this._updateFocusTrapState(),this._changeDetectorRef.markForCheck())},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"drawer",{get:function(){return this._drawer},set:function(e){this._drawer!==e&&(this._drawer=e,this.drawerChange.emit(),this._updateFocusTrapState())},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"autoFocus",{get:function(){return this._autoFocus},set:function(e){this._autoFocus=o.coerceBooleanProperty(e)},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"restoreFocus",{get:function(){return this._restoreFocus},set:function(e){this._restoreFocus=o.coerceBooleanProperty(e)},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"fixedAdjustElement",{get:function(){return this._fixedAdjustElement},set:function(e){this._fixedAdjustElement=e,e?this._getHostElement().style.setProperty("position","absolute"):this._getHostElement().style.removeProperty("position"),this._changeDetectorRef.markForCheck()},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"modal",{get:function(){return"modal"===this.drawer},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"dismissible",{get:function(){return"dismissible"===this.drawer},enumerable:!0,configurable:!0}),Object.defineProperty(c.prototype,"_isFocusTrapEnabled",{get:function(){return this.open&&this.modal},enumerable:!0,configurable:!0}),c.prototype.getDefaultFoundation=function(){var e=this,t={addClass:function(t){return e._getHostElement().classList.add(t)},removeClass:function(t){return e._getHostElement().classList.remove(t)},hasClass:function(t){return e._getHostElement().classList.contains(t)},elementHasClass:function(e,t){return e.classList.contains(t)},saveFocus:function(){return e._savePreviouslyFocusedElement()},restoreFocus:function(){return e._releaseFocus()},focusActiveNavigationItem:function(){var t;if(e._platform.isBrowser&&e._list&&e._autoFocus){var n=e._list.getSelectedItem();if(n)n.focus();else null===(t=e._platform.isBrowser?document.querySelector("[cdkFocusInitial]"):null)||void 0===t||t.focus()}},notifyClose:function(){return e.closed.emit()},notifyOpen:function(){return e.opened.emit()},trapFocus:function(){},releaseFocus:function(){return e._releaseFocus()}};return this.modal?new l.MDCModalDrawerFoundation(t):new l.MDCDismissibleDrawerFoundation(t)},c.prototype.ngAfterContentInit=function(){this._initListType()},c.prototype.ngOnDestroy=function(){var e,t,n;this.open=!1,null===(e=this._focusTrap)||void 0===e||e.destroy(),null===(t=this._scrimElement)||void 0===t||t.remove(),null===(n=this._scrimSubscription)||void 0===n||n.unsubscribe(),this._destroyed.next(),this._destroyed.complete(),this._foundation&&this._platform.isBrowser&&this._foundation.destroy()},c.prototype._handleTransitionEnd=function(e){this._foundation.handleTransitionEnd(e)},c.prototype._createScrim=function(){var e=this;this._platform.isBrowser&&(this._scrimElement=document.createElement("div"),this._scrimElement.classList.add("mdc-drawer-scrim"),this._getHostElement().insertAdjacentElement("afterend",this._scrimElement),this._scrimSubscription=this._ngZone.runOutsideAngular((function(){return i.fromEvent(e._scrimElement,"click").subscribe((function(){return e._ngZone.run((function(){return e.open=!1}))}))})))},c.prototype._initFoundation=function(){this._getHostElement().classList.remove(l.cssClasses.MODAL),this._getHostElement().classList.remove(l.cssClasses.DISMISSIBLE),this._foundation=this.getDefaultFoundation(),this._foundation.init(),(this.modal||this.dismissible)&&this._getHostElement().classList.add(l.cssClasses.ROOT+"--"+this.drawer),this._scrimElement&&(this._scrimSubscription&&this._scrimSubscription.unsubscribe(),this._scrimElement.remove(),this._scrimElement=null),this.modal?(this._focusTrap=this._focusTrapFactory.create(this._elementRef.nativeElement),this._updateFocusTrapState(),this._createScrim()):this._focusTrap&&this._focusTrap.destroy(),this._changeDetectorRef.markForCheck()},c.prototype._initListType=function(){this._list&&(this._list.singleSelection||void 0===this._list.singleSelection)&&(this._list.wrapFocus=!0,this._list.singleSelection=!0,this._list.useActivatedClass=!0)},c.prototype._updateFocusTrapState=function(){this._focusTrap&&(this._focusTrap.enabled=this._isFocusTrapEnabled)},c.prototype._trapFocus=function(){var e=this;this.autoFocus&&this._focusTrap.focusInitialElementWhenReady().then((function(t){t||"function"!=typeof e._elementRef.nativeElement.focus||e._elementRef.nativeElement.focus()}))},c.prototype._releaseFocus=function(){if(this.autoFocus){var e=this._document&&this._document.activeElement;e&&this._elementRef.nativeElement.contains(e)&&(this._elementFocusedBeforeDrawerWasOpened instanceof HTMLElement?this._focusMonitor.focusVia(this._elementFocusedBeforeDrawerWasOpened,this._openedVia):this._elementRef.nativeElement.blur()),this._elementFocusedBeforeDrawerWasOpened=null,this._openedVia=null}},c.prototype._savePreviouslyFocusedElement=function(){var e=this;this._document&&(this._elementFocusedBeforeDrawerWasOpened=this._document.activeElement,this._elementRef.nativeElement.focus&&Promise.resolve().then((function(){return e._elementRef.nativeElement.focus()})))},c.prototype._getHostElement=function(){return this.elementRef.nativeElement},c.decorators=[{type:t.Component,args:[{selector:"mdc-drawer",exportAs:"mdcDrawer",host:{role:"navigation",class:"mdc-drawer","(transitionend)":"_handleTransitionEnd($event)"},template:"<ng-content></ng-content>",changeDetection:t.ChangeDetectionStrategy.OnPush,encapsulation:t.ViewEncapsulation.None}]}],c.ctorParameters=function(){return[{type:s.Platform},{type:t.NgZone},{type:t.ChangeDetectorRef},{type:r.FocusTrapFactory},{type:r.FocusMonitor},{type:void 0,decorators:[{type:t.Optional},{type:t.Inject,args:[n.DOCUMENT]}]},{type:t.ElementRef}]},c.propDecorators={open:[{type:t.Input}],drawer:[{type:t.Input}],autoFocus:[{type:t.Input}],restoreFocus:[{type:t.Input}],fixedAdjustElement:[{type:t.Input}],opened:[{type:t.Output}],closed:[{type:t.Output}],openedChange:[{type:t.Output}],drawerChange:[{type:t.Output}],_list:[{type:t.ContentChild,args:[u.MdcList,{static:!1}]}]},c}(c.MDCComponent),f=function(){function e(){}return e.decorators=[{type:t.Directive,args:[{selector:"[mdcDrawerTitle]",host:{class:"mdc-drawer__title"}}]}],e}(),_=function(){function e(){}return e.decorators=[{type:t.Directive,args:[{selector:"[mdcDrawerSubtitle]",host:{class:"mdc-drawer__subtitle"}}]}],e}(),h=function(){function e(){}return e.decorators=[{type:t.Directive,args:[{selector:"mdc-drawer-content, [mdcDrawerContent]",host:{class:"mdc-drawer__content"}}]}],e}(),g=function(){function e(){}return e.decorators=[{type:t.Directive,args:[{selector:"mdc-drawer-app-content, [mdcDrawerAppContent]",host:{class:"mdc-drawer-app-content"}}]}],e}(),y=[m,g,h,p,_,f],w=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{imports:[n.CommonModule],exports:[y],declarations:[y]}]}],e}();e.MdcDrawer=m,e.MdcDrawerAppContent=g,e.MdcDrawerContent=h,e.MdcDrawerHeader=p,e.MdcDrawerModule=w,e.MdcDrawerSubtitle=_,e.MdcDrawerTitle=f,Object.defineProperty(e,"__esModule",{value:!0})}));