blob: 02faf6bb196f2cc6c74119638a2913f79f0732ba [file] [log] [blame]
{"version":3,"sources":["ng://@covalent/core/message/message.component.ts","ng://@covalent/core/message/message.module.ts"],"names":["TdMessageContainerDirective","Directive","args","selector","ViewContainerRef","viewContainer","this","Object","defineProperty","TdMessageComponent","prototype","value","_opened","duration","_hidden","undefined","_color","color","_renderer","removeClass","_elementRef","nativeElement","addClass","_changeDetectorRef","markForCheck","opened","_initialized","open","close","animationDoneListener","_detach","_animating","ngAfterViewInit","_this","Promise","resolve","then","_attach","_startAnimationState","toggle","_childElement","createEmbeddedView","_template","clear","Component","template","animations","tdCollapseAnimation","Renderer2","ChangeDetectorRef","ElementRef","ViewChild","TemplateRef","HostBinding","Input","HostListener","icon","TD_MESSAGE","CovalentMessageModule","NgModule","imports","CommonModule","MatIconModule","declarations","exports"],"mappings":"mjBAAA,IAAAA,uBAKCC,EAAAA,UAASC,KAAA,CAAC,CACTC,SAAU,oEANgEC,EAAAA,oBAU5EJ,GADE,SAAAA,EAAmBK,GAAAC,KAAAD,cAAAA,SAyBnBE,OAAAC,eACIC,EAAAC,UAAA,qBAAkB,KADtB,WAEE,MAAO,CAAEC,OAAQL,KAAKM,QAASC,SAAU,sCAM3CN,OAAAC,eACIC,EAAAC,UAAA,SAAM,KADV,WAEE,OAAOJ,KAAKQ,QAAU,OAASC,2CA+BjCR,OAAAC,eACIC,EAAAC,UAAA,QAAK,KAaT,WACE,OAAOJ,KAAKU,YAfd,SACUC,GACRX,KAAKY,UAAUC,YAAYb,KAAKc,YAAYC,cAAe,OAASf,KAAKU,QACzEV,KAAKY,UAAUC,YAAYb,KAAKc,YAAYC,cAAe,OAASf,KAAKU,OAAS,QAClFV,KAAKY,UAAUC,YAAYb,KAAKc,YAAYC,cAAe,MAAQf,KAAKU,OAAS,QACnE,YAAVC,GAAiC,WAAVA,GAAgC,SAAVA,EAC/CX,KAAKY,UAAUI,SAAShB,KAAKc,YAAYC,cAAe,OAASJ,IAEjEX,KAAKY,UAAUI,SAAShB,KAAKc,YAAYC,cAAe,OAASJ,EAAQ,QACzEX,KAAKY,UAAUI,SAAShB,KAAKc,YAAYC,cAAe,MAAQJ,EAAQ,SAE1EX,KAAKU,OAASC,EACdX,KAAKiB,mBAAmBC,gDAY1BjB,OAAAC,eACIC,EAAAC,UAAA,SAAM,KAWV,WACE,OAAOJ,KAAKM,aAbd,SACWa,GACLnB,KAAKoB,aACHD,EACFnB,KAAKqB,OAELrB,KAAKsB,QAGPtB,KAAKM,QAAUa,mCAkBnBhB,EAAAC,UAAAmB,sBADA,WAEOvB,KAAKM,UACRN,KAAKQ,SAAU,EACfR,KAAKwB,WAEPxB,KAAKyB,YAAa,EAClBzB,KAAKiB,mBAAmBC,gBAM1Bf,EAAAC,UAAAsB,gBAAA,WAAA,IAAAC,EAAA3B,KACE4B,QAAQC,QAAQpB,WAAWqB,KAAK,WAC1BH,EAAKrB,SACPqB,EAAKI,UAEPJ,EAAKP,cAAe,KAQxBjB,EAAAC,UAAAiB,KAAA,WACOrB,KAAKM,SAAYN,KAAKyB,aACzBzB,KAAKM,SAAU,EACfN,KAAK+B,UACL/B,KAAKgC,yBAQT7B,EAAAC,UAAAkB,MAAA,WACMtB,KAAKM,UAAYN,KAAKyB,aACxBzB,KAAKM,SAAU,EACfN,KAAKgC,yBAOT7B,EAAAC,UAAA6B,OAAA,WACMjC,KAAKM,QACPN,KAAKsB,QAELtB,KAAKqB,QAODlB,EAAAC,UAAA4B,qBAAR,WACEhC,KAAKyB,YAAa,EAClBzB,KAAKQ,SAAU,EACfR,KAAKiB,mBAAmBC,gBAMlBf,EAAAC,UAAA2B,QAAR,WACE/B,KAAKkC,cAAcnC,cAAcoC,mBAAmBnC,KAAKoC,WACzDpC,KAAKiB,mBAAmBC,gBAMlBf,EAAAC,UAAAoB,QAAR,WACExB,KAAKkC,cAAcnC,cAAcsC,QACjCrC,KAAKiB,mBAAmBC,oCA/L3BoB,EAAAA,UAAS1C,KAAA,CAAC,CACTC,SAAU,aACV0C,SAAA,saAEAC,WAAY,CACVC,EAAAA,2uBAjBkCC,EAAAA,iBACFC,EAAAA,yBADaC,EAAAA,qDA4B9CC,EAAAA,UAASjD,KAAA,CAACF,sBACVmD,EAAAA,UAASjD,KAAA,CAACkD,EAAAA,yCAKVC,EAAAA,YAAWnD,KAAA,CAAC,+BAQZmD,EAAAA,YAAWnD,KAAA,CAAC,gCAUZoD,EAAAA,MAAKpD,KAAA,CAAC,2BAONoD,EAAAA,MAAKpD,KAAA,CAAC,0BAQNoD,EAAAA,MAAKpD,KAAA,CAAC,uBAQNoD,EAAAA,MAAKpD,KAAA,CAAC,yBAwBNoD,EAAAA,MAAKpD,KAAA,CAAC,yCA0BNqD,EAAAA,aAAYrD,KAAA,CAAC,uBAgFhBO,GA1FE,SAAAA,EAAoBS,EACAK,EACAH,GAFAd,KAAAY,UAAAA,EACAZ,KAAAiB,mBAAAA,EACAjB,KAAAc,YAAAA,EA9FZd,KAAAM,SAAmB,EACnBN,KAAAQ,SAAmB,EACnBR,KAAAyB,YAAsB,EACtBzB,KAAAoB,cAAwB,EAyCjBpB,KAAAkD,KAAe,eAmD5BlD,KAAKY,UAAUI,SAAShB,KAAKc,YAAYC,cAAe,kBC9GtDoC,EAA0B,CAC9BhD,EACAT,GAGF0D,uBAACC,EAAAA,SAAQzD,KAAA,CAAC,CACR0D,QAAS,CACPC,EAAAA,aACAC,EAAAA,eAEFC,aAAc,CACZN,GAEFO,QAAS,CACPP,OAKJC,GAdA,SAAAA","sourcesContent":["import { Component, Directive, Input, Renderer2, ElementRef, AfterViewInit, ViewContainerRef, TemplateRef, ViewChild,\n HostBinding, HostListener, ChangeDetectorRef } from '@angular/core';\n\nimport { tdCollapseAnimation } from '@covalent/core/common';\n\n@Directive({\n selector: '[tdMessageContainer]',\n})\nexport class TdMessageContainerDirective {\n constructor(public viewContainer: ViewContainerRef) { }\n}\n\n@Component({\n selector: 'td-message',\n templateUrl: './message.component.html',\n styleUrls: ['./message.component.scss'],\n animations: [\n tdCollapseAnimation,\n ],\n})\nexport class TdMessageComponent implements AfterViewInit {\n\n private _color: string;\n private _opened: boolean = true;\n private _hidden: boolean = false;\n private _animating: boolean = false;\n private _initialized: boolean = false;\n\n @ViewChild(TdMessageContainerDirective) _childElement: TdMessageContainerDirective;\n @ViewChild(TemplateRef) _template: TemplateRef<any>;\n\n /**\n * Binding host to tdCollapse animation\n */\n @HostBinding('@tdCollapse')\n get collapsedAnimation(): any {\n return { value: !this._opened, duration: 100 };\n }\n\n /**\n * Binding host to display style when hidden\n */\n @HostBinding('style.display')\n get hidden(): string {\n return this._hidden ? 'none' : undefined;\n }\n\n /**\n * label: string\n *\n * Sets the label of the message.\n */\n @Input('label') label: string;\n\n /**\n * sublabel?: string\n *\n * Sets the sublabel of the message.\n */\n @Input('sublabel') sublabel: string;\n\n /**\n * icon?: string\n *\n * The icon to be displayed before the title.\n * Defaults to `info_outline` icon\n */\n @Input('icon') icon: string = 'info_outline';\n\n /**\n * color?: primary | accent | warn\n *\n * Sets the color of the message.\n * Can also use any material color: purple | light-blue, etc.\n */\n @Input('color')\n set color(color: string) {\n this._renderer.removeClass(this._elementRef.nativeElement, 'mat-' + this._color);\n this._renderer.removeClass(this._elementRef.nativeElement, 'bgc-' + this._color + '-100');\n this._renderer.removeClass(this._elementRef.nativeElement, 'tc-' + this._color + '-700');\n if (color === 'primary' || color === 'accent' || color === 'warn') {\n this._renderer.addClass(this._elementRef.nativeElement, 'mat-' + color);\n } else {\n this._renderer.addClass(this._elementRef.nativeElement, 'bgc-' + color + '-100');\n this._renderer.addClass(this._elementRef.nativeElement, 'tc-' + color + '-700');\n }\n this._color = color;\n this._changeDetectorRef.markForCheck();\n }\n get color(): string {\n return this._color;\n }\n\n /**\n * opened?: boolean\n *\n * Shows or hiddes the message depending on its value.\n * Defaults to 'true'.\n */\n @Input('opened')\n set opened(opened: boolean) {\n if (this._initialized) {\n if (opened) {\n this.open();\n } else {\n this.close();\n }\n } else {\n this._opened = opened;\n }\n }\n get opened(): boolean {\n return this._opened;\n }\n\n constructor(private _renderer: Renderer2,\n private _changeDetectorRef: ChangeDetectorRef,\n private _elementRef: ElementRef) {\n this._renderer.addClass(this._elementRef.nativeElement, 'td-message');\n }\n\n /**\n * Detach element when close animation is finished to set animating state to false\n * hidden state to true and detach element from DOM\n */\n @HostListener('@tdCollapse.done')\n animationDoneListener(): void {\n if (!this._opened) {\n this._hidden = true;\n this._detach();\n }\n this._animating = false;\n this._changeDetectorRef.markForCheck();\n }\n\n /**\n * Initializes the component and attaches the content.\n */\n ngAfterViewInit(): void {\n Promise.resolve(undefined).then(() => {\n if (this._opened) {\n this._attach();\n }\n this._initialized = true;\n });\n }\n\n /**\n * Renders the message on screen\n * Validates if there is an animation currently and if its already opened\n */\n open(): void {\n if (!this._opened && !this._animating) {\n this._opened = true;\n this._attach();\n this._startAnimationState();\n }\n }\n\n /**\n * Removes the message content from screen.\n * Validates if there is an animation currently and if its already closed\n */\n close(): void {\n if (this._opened && !this._animating) {\n this._opened = false;\n this._startAnimationState();\n }\n }\n\n /**\n * Toggles between open and close depending on state.\n */\n toggle(): void {\n if (this._opened) {\n this.close();\n } else {\n this.open();\n }\n }\n\n /**\n * Method to set the state before starting an animation\n */\n private _startAnimationState(): void {\n this._animating = true;\n this._hidden = false;\n this._changeDetectorRef.markForCheck();\n }\n\n /**\n * Method to attach template to DOM\n */\n private _attach(): void {\n this._childElement.viewContainer.createEmbeddedView(this._template);\n this._changeDetectorRef.markForCheck();\n }\n\n /**\n * Method to detach template from DOM\n */\n private _detach(): void {\n this._childElement.viewContainer.clear();\n this._changeDetectorRef.markForCheck();\n }\n}\n","import { Type } from '@angular/core';\nimport { NgModule } from '@angular/core';\n\nimport { CommonModule } from '@angular/common';\nimport { MatIconModule } from '@angular/material/icon';\n\nimport { TdMessageComponent, TdMessageContainerDirective } from './message.component';\n\nconst TD_MESSAGE: Type<any>[] = [\n TdMessageComponent,\n TdMessageContainerDirective,\n];\n\n@NgModule({\n imports: [\n CommonModule,\n MatIconModule,\n ],\n declarations: [\n TD_MESSAGE,\n ],\n exports: [\n TD_MESSAGE,\n ],\n})\nexport class CovalentMessageModule {\n\n}\n"]}