UNPKG

@openexo/design-system

Version:
132 lines 8.87 kB
/** * @fileoverview added by tsickle * Generated from: lib/alert/alert.component.ts * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ import { Component, Output, Input, EventEmitter, ChangeDetectionStrategy } from '@angular/core'; import { DomSanitizer } from '@angular/platform-browser'; /** @enum {string} */ var TypeAlertEnum = { info: "info", success: "success", warning: "warning", danger: "danger", }; var AlertComponent = /** @class */ (function () { function AlertComponent(sanitizer) { this.sanitizer = sanitizer; /** * Type of alert to show. By default is info type */ this.typeAlert = TypeAlertEnum.info; /** * Indicates if the alert can be closed. */ this.isCloseable = false; /** * Emit an event when the user click on a button with action */ this.sendAction = new EventEmitter(); this.showMessage = true; this.typeAlertEnum = TypeAlertEnum; } /** * @return {?} */ AlertComponent.prototype.ngOnInit = /** * @return {?} */ function () { if (this.isCloseable && !this.closeButtonText) { console.error('If the button is closable you need indicates the text for the button in small resolutions'); } this.message = (/** @type {?} */ (this.sanitizer.bypassSecurityTrustHtml(this.message))); }; /** * Action to hide the alert */ /** * Action to hide the alert * @return {?} */ AlertComponent.prototype.onClose = /** * Action to hide the alert * @return {?} */ function () { this.showMessage = false; }; /** * @return {?} */ AlertComponent.prototype.onAction = /** * @return {?} */ function () { this.sendAction.emit(); }; AlertComponent.decorators = [ { type: Component, args: [{ selector: 'exo-alert', template: "<div *ngIf=\"showMessage\" class=\"alert__container {{typeAlert}}\">\n <div class=\"body-2 alert__description\">\n <ng-container [ngSwitch]=\"typeAlert\">\n <mat-icon *ngSwitchCase=\"typeAlertEnum.info\" class=\"icon_type\">info</mat-icon>\n <mat-icon *ngSwitchCase=\"typeAlertEnum.success\" class=\"icon_type\" >check_circle</mat-icon>\n <mat-icon *ngSwitchCase=\"typeAlertEnum.warning\" class=\"icon_type\">warning</mat-icon>\n <mat-icon *ngSwitchCase=\"typeAlertEnum.danger\" class=\"icon_type\">cancel</mat-icon>\n </ng-container>\n <div [innerHtml]=\"message\"></div>\n </div>\n <button class=\"alert__action-button push-left-xs\" *ngIf=\"actionButtonText\" mat-button color=\"primary\" (click)=\"onAction()\">{{actionButtonText}}</button>\n <ng-container *ngIf=\"isCloseable\">\n <mat-icon (click)=\"onClose()\" class=\"push-left-xs pointer alert__close-icon\">close</mat-icon>\n <button class=\"alert__action-button close push-left-xxs\" mat-button color=\"primary\" (click)=\"onClose()\">{{closeButtonText}}</button>\n </ng-container>\n</div>\n\n", changeDetection: ChangeDetectionStrategy.OnPush, styles: [""] }] } ]; /** @nocollapse */ AlertComponent.ctorParameters = function () { return [ { type: DomSanitizer } ]; }; AlertComponent.propDecorators = { typeAlert: [{ type: Input }], message: [{ type: Input }], isCloseable: [{ type: Input }], closeButtonText: [{ type: Input }], actionButtonText: [{ type: Input }], sendAction: [{ type: Output }] }; return AlertComponent; }()); export { AlertComponent }; if (false) { /** * Type of alert to show. By default is info type * @type {?} */ AlertComponent.prototype.typeAlert; /** * Message to show inside of alert. * @type {?} */ AlertComponent.prototype.message; /** * Indicates if the alert can be closed. * @type {?} */ AlertComponent.prototype.isCloseable; /** * Text for the button Close * @type {?} */ AlertComponent.prototype.closeButtonText; /** * Text for the button with action * @type {?} */ AlertComponent.prototype.actionButtonText; /** * Emit an event when the user click on a button with action * @type {?} */ AlertComponent.prototype.sendAction; /** @type {?} */ AlertComponent.prototype.showMessage; /** @type {?} */ AlertComponent.prototype.typeAlertEnum; /** * @type {?} * @private */ AlertComponent.prototype.sanitizer; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQG9wZW5leG8vZGVzaWduLXN5c3RlbS8iLCJzb3VyY2VzIjpbImxpYi9hbGVydC9hbGVydC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLE1BQU0sRUFBRSxLQUFLLEVBQUUsWUFBWSxFQUFFLHVCQUF1QixFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3hHLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQzs7QUFFekQsSUFBSyxhQUFhO0lBQ2hCLElBQUksUUFBUztJQUNiLE9BQU8sV0FBWTtJQUNuQixPQUFPLFdBQVk7SUFDbkIsTUFBTSxVQUFXO0VBQ2xCO0FBRUQ7SUEwQ0Usd0JBQ1UsU0FBdUI7UUFBdkIsY0FBUyxHQUFULFNBQVMsQ0FBYzs7OztRQS9CeEIsY0FBUyxHQUFHLGFBQWEsQ0FBQyxJQUFJLENBQUM7Ozs7UUFVL0IsZ0JBQVcsR0FBRyxLQUFLLENBQUM7Ozs7UUFlbkIsZUFBVSxHQUFzQixJQUFJLFlBQVksRUFBRSxDQUFDO1FBRTdELGdCQUFXLEdBQUcsSUFBSSxDQUFDO1FBQ25CLGtCQUFhLEdBQUcsYUFBYSxDQUFDO0lBSTFCLENBQUM7Ozs7SUFFTCxpQ0FBUTs7O0lBQVI7UUFDRSxJQUFJLElBQUksQ0FBQyxXQUFXLElBQUksQ0FBQyxJQUFJLENBQUMsZUFBZSxFQUFFO1lBQzdDLE9BQU8sQ0FBQyxLQUFLLENBQUMsMkZBQTJGLENBQUMsQ0FBQztTQUM1RztRQUNELElBQUksQ0FBQyxPQUFPLEdBQUcsbUJBQVEsSUFBSSxDQUFDLFNBQVMsQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLEVBQUEsQ0FBQztJQUM5RSxDQUFDO0lBRUQ7O09BRUc7Ozs7O0lBQ0gsZ0NBQU87Ozs7SUFBUDtRQUNFLElBQUksQ0FBQyxXQUFXLEdBQUcsS0FBSyxDQUFDO0lBQzNCLENBQUM7Ozs7SUFFRCxpQ0FBUTs7O0lBQVI7UUFDRSxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3pCLENBQUM7O2dCQTlERixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLFdBQVc7b0JBQ3JCLGtsQ0FBcUM7b0JBRXJDLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNOztpQkFDaEQ7Ozs7Z0JBZFEsWUFBWTs7OzRCQXFCbEIsS0FBSzswQkFLTCxLQUFLOzhCQUtMLEtBQUs7a0NBS0wsS0FBSzttQ0FLTCxLQUFLOzZCQUtMLE1BQU07O0lBMEJULHFCQUFDO0NBQUEsQUEvREQsSUErREM7U0F4RFksY0FBYzs7Ozs7O0lBS3pCLG1DQUF3Qzs7Ozs7SUFLeEMsaUNBQXlCOzs7OztJQUt6QixxQ0FBNkI7Ozs7O0lBSzdCLHlDQUFpQzs7Ozs7SUFLakMsMENBQWtDOzs7OztJQUtsQyxvQ0FBNkQ7O0lBRTdELHFDQUFtQjs7SUFDbkIsdUNBQThCOzs7OztJQUc1QixtQ0FBK0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCwgT3V0cHV0LCBJbnB1dCwgRXZlbnRFbWl0dGVyLCBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRG9tU2FuaXRpemVyIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5cbmVudW0gVHlwZUFsZXJ0RW51bSB7XG4gIGluZm8gPSAnaW5mbycsXG4gIHN1Y2Nlc3MgPSAnc3VjY2VzcycsXG4gIHdhcm5pbmcgPSAnd2FybmluZycsXG4gIGRhbmdlciA9ICdkYW5nZXInLFxufVxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdleG8tYWxlcnQnLFxuICB0ZW1wbGF0ZVVybDogJy4vYWxlcnQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9hbGVydC5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5cbmV4cG9ydCBjbGFzcyBBbGVydENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG5cbiAgLyoqXG4gICAqIFR5cGUgb2YgYWxlcnQgdG8gc2hvdy4gQnkgZGVmYXVsdCBpcyBpbmZvIHR5cGVcbiAgICovXG4gIEBJbnB1dCgpIHR5cGVBbGVydCA9IFR5cGVBbGVydEVudW0uaW5mbztcblxuICAvKipcbiAgICogTWVzc2FnZSB0byBzaG93IGluc2lkZSBvZiBhbGVydC5cbiAgICovXG4gIEBJbnB1dCgpIG1lc3NhZ2U6IHN0cmluZztcblxuICAvKipcbiAgICogSW5kaWNhdGVzIGlmIHRoZSBhbGVydCBjYW4gYmUgY2xvc2VkLlxuICAgKi9cbiAgQElucHV0KCkgaXNDbG9zZWFibGUgPSBmYWxzZTtcblxuICAvKipcbiAgICogVGV4dCBmb3IgdGhlIGJ1dHRvbiBDbG9zZVxuICAgKi9cbiAgQElucHV0KCkgY2xvc2VCdXR0b25UZXh0OiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIFRleHQgZm9yIHRoZSBidXR0b24gd2l0aCBhY3Rpb25cbiAgICovXG4gIEBJbnB1dCgpIGFjdGlvbkJ1dHRvblRleHQ6IHN0cmluZztcblxuICAvKipcbiAgICogRW1pdCBhbiBldmVudCB3aGVuIHRoZSB1c2VyIGNsaWNrIG9uIGEgYnV0dG9uIHdpdGggYWN0aW9uXG4gICAqL1xuICBAT3V0cHV0KCkgc2VuZEFjdGlvbjogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgc2hvd01lc3NhZ2UgPSB0cnVlO1xuICB0eXBlQWxlcnRFbnVtID0gVHlwZUFsZXJ0RW51bTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIHNhbml0aXplcjogRG9tU2FuaXRpemVyLFxuICApIHsgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIGlmICh0aGlzLmlzQ2xvc2VhYmxlICYmICF0aGlzLmNsb3NlQnV0dG9uVGV4dCkge1xuICAgICAgY29uc29sZS5lcnJvcignSWYgdGhlIGJ1dHRvbiBpcyBjbG9zYWJsZSB5b3UgbmVlZCBpbmRpY2F0ZXMgdGhlIHRleHQgZm9yIHRoZSBidXR0b24gaW4gc21hbGwgcmVzb2x1dGlvbnMnKTtcbiAgICB9XG4gICAgdGhpcy5tZXNzYWdlID0gPHN0cmluZz50aGlzLnNhbml0aXplci5ieXBhc3NTZWN1cml0eVRydXN0SHRtbCh0aGlzLm1lc3NhZ2UpO1xuICB9XG5cbiAgLyoqXG4gICAqIEFjdGlvbiB0byBoaWRlIHRoZSBhbGVydFxuICAgKi9cbiAgb25DbG9zZSgpIHtcbiAgICB0aGlzLnNob3dNZXNzYWdlID0gZmFsc2U7XG4gIH1cblxuICBvbkFjdGlvbigpIHtcbiAgICB0aGlzLnNlbmRBY3Rpb24uZW1pdCgpO1xuICB9XG59XG4iXX0=