@duoduo-oba/ng-devui
Version:
DevUI components based on Angular
120 lines (113 loc) • 11 kB
JavaScript
import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
/**
* @fileoverview added by tsickle
* Generated from: alert.types.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: alert.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AlertComponent = /** @class */ (function () {
function AlertComponent() {
this.type = 'info';
this.closeable = true;
this.showIcon = true;
this.closeEvent = new EventEmitter;
this.hide = false;
}
Object.defineProperty(AlertComponent.prototype, "dismissTime", {
set: /**
* @param {?} time
* @return {?}
*/
function (time) {
var _this = this;
setTimeout((/**
* @return {?}
*/
function () {
_this.close();
}), time);
},
enumerable: true,
configurable: true
});
/**
* @return {?}
*/
AlertComponent.prototype.close = /**
* @return {?}
*/
function () {
this.closeEvent.emit(this);
this.hide = true;
};
AlertComponent.decorators = [
{ type: Component, args: [{
selector: 'd-alert',
template: "<div class=\"devui-alert devui-alert-{{ type }} {{ cssClass }}\" *ngIf=\"!hide\">\r\n <button type=\"button\" class=\"devui-close\" (click)=\"close()\" *ngIf=\"closeable\">\r\n <svg\r\n width=\"16px\"\r\n height=\"16px\"\r\n viewBox=\"0 0 14 14\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <defs>\r\n <polygon\r\n id=\"path-1\"\r\n points=\"8.07106781 6.65685425 10.8994949 3.82842712 12.3137085 5.24264069 9.48528137 8.07106781 12.3137085 10.8994949 10.8994949 12.3137085 8.07106781 9.48528137 5.24264069 12.3137085 3.82842712 10.8994949 6.65685425 8.07106781 3.82842712 5.24264069 5.24264069 3.82842712\"\r\n ></polygon>\r\n </defs>\r\n <g id=\"error\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <use *ngIf=\"type != 'warning' && type != 'info'\" id=\"Mask\" class=\"devui-alert-icon-close-no-warn\" xlink:href=\"#path-1\"></use>\r\n <use *ngIf=\"type == 'warning' || type == 'info'\" id=\"Mask\" class=\"devui-alert-icon-close-warn\" xlink:href=\"#path-1\"></use>\r\n </g>\r\n </svg>\r\n </button>\r\n <span class=\"devui-alert-icon\" *ngIf=\"showIcon !== false\">\r\n <svg\r\n *ngIf=\"type === 'success'\"\r\n class=\"devui-icon devui-icon-success\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <circle cx=\"8\" cy=\"8\" r=\"7\"></circle>\r\n <path d=\"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z\" fill-rule=\"nonzero\"></path>\r\n <polygon\r\n stroke-width=\"0.4\"\r\n fill-rule=\"nonzero\"\r\n points=\"8.16 10.48 7.32 11.32 6.48 10.48 6.48 10.48 3.6 7.68 4.44 6.84 7.28 9.68 11.52 5.44 12.36 6.28\"\r\n ></polygon>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"type === 'warning'\"\r\n class=\"devui-icon devui-icon-warning\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <polygon\r\n points=\"7.5 1.74501946 1.39184847 13.5954649 7.08947368 14.2207621 13.9973698 13.5954649 10.9383683 5.61273879 8.40084114 1.27624313\"\r\n ></polygon>\r\n <path\r\n d=\"M8.51325441,0.127397589 C8.70423071,0.228333932 8.8605922,0.383286648 8.96244623,0.57254229 L15.8714442,13.4101975 C16.1549662,13.9370117 15.9538562,14.5918482 15.4222523,14.8728158 C15.2642579,14.9563203 15.0879506,15 14.9088903,15 L1.09089441,15 C0.488410063,15 0,14.5159904 0,13.9189343 C0,13.7414873 0.0440768395,13.5667684 0.128340519,13.4101975 L7.03733844,0.57254229 C7.32086049,0.0457280838 7.98165058,-0.153569987 8.51325441,0.127397589 Z M8.87894737,11.2105263 L7.08947368,11.2105263 L7.08947368,13 L8.87894737,13 L8.87894737,11.2105263 Z M8.96842105,4.5 L7,4.5 L7.08947368,9.86842105 L8.87894737,9.86842105 L8.96842105,4.5 Z\"\r\n ></path>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"type === 'info'\"\r\n class=\"devui-icon devui-icon-info\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <circle cx=\"8\" cy=\"8\" r=\"7\"></circle>\r\n <g stroke-width=\"1\">\r\n <path\r\n d=\"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z M9,5 L7,5 L7,3 L9,3 L9,5 Z M9,12.6 L7,12.6 L7,6.6 L9,6.6 L9,12.6 Z\"\r\n ></path>\r\n </g>\r\n </g>\r\n </svg>\r\n <svg\r\n *ngIf=\"type === 'danger'\"\r\n class=\"devui-icon devui-icon-error\"\r\n viewBox=\"0 0 16 16\"\r\n version=\"1.1\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n >\r\n <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n <circle cx=\"8\" cy=\"8\" r=\"7\"></circle>\r\n <path\r\n d=\"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z M9,12.6 L7,12.6 L7,10.6 L9,10.6 L9,12.6 Z M9,9.1 L7,9.1 L6.9,3.1 L9.1,3.1 L9,9.1 Z\"\r\n fill-rule=\"nonzero\"\r\n ></path>\r\n </g>\r\n </svg>\r\n </span>\r\n <ng-content></ng-content>\r\n</div>\r\n",
styles: [":host{display:block}.devui-alert{color:#252b3a;font-size:12px;border:1px solid transparent;padding:10px;line-height:20px}.devui-alert button.devui-close{color:#252b3a;opacity:1;box-shadow:none}.devui-alert button.devui-close>svg use{fill:#fff}.devui-alert button.devui-close span{color:#252b3a;font-size:12px;font-weight:700}.devui-alert.devui-alert-success{background-color:#edfff9;border-color:#50d4ab;color:#252b3a}.devui-alert.devui-alert-success button.devui-close{color:#50d4ab}.devui-alert.devui-alert-success button.devui-close>svg use{fill:#50d4ab}.devui-alert.devui-alert-info{background-color:#e9edfa;border-color:#96adfa;color:#252b3a}.devui-alert.devui-alert-info button.devui-close{color:#5e7ce0}.devui-alert.devui-alert-info button.devui-close>svg use{fill:#5e7ce0}.devui-alert.devui-alert-warning{background-color:#fff3e8;border-color:#ffbf85;color:#252b3a}.devui-alert.devui-alert-warning button.devui-close{color:#fac20a}.devui-alert.devui-alert-warning button.devui-close>svg use{fill:#fac20a}.devui-alert.devui-alert-danger{background-color:#ffeeed;border-color:#ffa4a1;color:#252b3a}.devui-alert.devui-alert-danger button.devui-close{color:#f66f6a}.devui-alert.devui-alert-danger button.devui-close>svg use{fill:#f66f6a}.devui-alert .devui-alert-icon{margin-right:10px}.devui-alert svg.devui-icon{width:16px;height:16px;vertical-align:middle;-webkit-transform:translateY(-1px);transform:translateY(-1px)}.devui-alert .devui-icon.icon-success>g>path{fill:#50d4ab}.devui-alert .devui-icon.icon-success>g>circle,.devui-alert .devui-icon.icon-success>g>polygon,.devui-alert .devui-icon.icon-warning>g>polygon{fill:#fff}.devui-alert .devui-icon.icon-warning>g>path{fill:#fac20a}.devui-alert .devui-icon.icon-info>g>g{fill:#5e7ce0}.devui-alert .devui-icon.icon-info>g>circle{fill:#fff}.devui-alert .devui-icon.icon-error>g>path{fill:#f66f6a}.devui-alert .devui-icon.icon-error>g>circle{fill:#fff}.devui-alert-icon{margin-right:10px}svg.devui-icon{width:16px;height:16px;vertical-align:middle;-webkit-transform:translateY(-1px);transform:translateY(-1px)}.devui-icon.devui-icon-success>g>path{fill:#50d4ab}.devui-icon.devui-icon-success>g>circle,.devui-icon.devui-icon-success>g>polygon,.devui-icon.devui-icon-warning>g>polygon{fill:#fff}.devui-icon.devui-icon-warning>g>path{fill:#fac20a}.devui-icon.devui-icon-info>g>g{fill:#5e7ce0}.devui-icon.devui-icon-info>g>circle{fill:#fff}.devui-icon.devui-icon-error>g>path{fill:#f66f6a}.devui-icon.devui-icon-error>g>circle{fill:#fff}"]
}] }
];
/** @nocollapse */
AlertComponent.ctorParameters = function () { return []; };
AlertComponent.propDecorators = {
type: [{ type: Input }],
cssClass: [{ type: Input }],
closeable: [{ type: Input }],
content: [{ type: Input }],
showIcon: [{ type: Input }],
closeEvent: [{ type: Output }],
dismissTime: [{ type: Input }]
};
return AlertComponent;
}());
if (false) {
/** @type {?} */
AlertComponent.prototype.type;
/** @type {?} */
AlertComponent.prototype.cssClass;
/** @type {?} */
AlertComponent.prototype.closeable;
/** @type {?} */
AlertComponent.prototype.content;
/** @type {?} */
AlertComponent.prototype.showIcon;
/** @type {?} */
AlertComponent.prototype.closeEvent;
/** @type {?} */
AlertComponent.prototype.hide;
}
/**
* @fileoverview added by tsickle
* Generated from: alert.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var AlertModule = /** @class */ (function () {
function AlertModule() {
}
AlertModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule],
exports: [AlertComponent],
declarations: [AlertComponent],
providers: [],
},] }
];
return AlertModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: ng-devui-alert.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { AlertComponent, AlertModule };
//# sourceMappingURL=ng-devui-alert.js.map