ngx-alert-modal 0.0.3 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -55,11 +55,11 @@ class NgxAlertModalComponent {
|
|
|
55
55
|
ev.stopPropagation();
|
|
56
56
|
}
|
|
57
57
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: NgxAlertModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
58
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: NgxAlertModalComponent, selector: "lib-ngx-alert-modal", ngImport: i0, template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] }); }
|
|
58
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: NgxAlertModalComponent, selector: "lib-ngx-alert-modal", ngImport: i0, template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999;inset:0}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] }); }
|
|
59
59
|
}
|
|
60
60
|
export { NgxAlertModalComponent };
|
|
61
61
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: NgxAlertModalComponent, decorators: [{
|
|
62
62
|
type: Component,
|
|
63
|
-
args: [{ selector: 'lib-ngx-alert-modal', template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"] }]
|
|
63
|
+
args: [{ selector: 'lib-ngx-alert-modal', template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999;inset:0}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"] }]
|
|
64
64
|
}] });
|
|
65
65
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LWFsZXJ0LW1vZGFsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1hbGVydC1tb2RhbC9zcmMvbGliL25neC1hbGVydC1tb2RhbC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtYWxlcnQtbW9kYWwvc3JjL2xpYi9uZ3gtYWxlcnQtbW9kYWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUUxQyxPQUFPLEVBQWMsT0FBTyxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQzNDLE9BQU8sRUFBZSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7O0FBRXBFLE1BS2Esc0JBQXNCO0lBTG5DO1FBT0UsVUFBSyxHQUFHLENBQUMsQ0FBQztRQUVPLGFBQVEsR0FBRyxJQUFJLE9BQU8sRUFBK0MsQ0FBQztRQUNoRixZQUFPLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxZQUFZLEVBQUUsQ0FBQztLQW9EL0M7SUFsREMsU0FBUztRQUNQLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO1lBQ2pCLEtBQUssRUFBRSxJQUFJLENBQUMsS0FBSztZQUNqQixNQUFNLEVBQUU7Z0JBQ04sV0FBVyxFQUFFLElBQUk7Z0JBQ2pCLFdBQVcsRUFBRSxLQUFLO2dCQUNsQixRQUFRLEVBQUUsS0FBSztnQkFDZixPQUFPLEVBQUUsYUFBYSxDQUFDLEtBQUs7YUFDN0I7U0FDRixDQUNBLENBQUM7SUFDSixDQUFDO0lBQ0QsUUFBUTtRQUNOLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO1lBQ2pCLEtBQUssRUFBRSxJQUFJLENBQUMsS0FBSztZQUNqQixNQUFNLEVBQUU7Z0JBQ04sV0FBVyxFQUFFLEtBQUs7Z0JBQ2xCLFdBQVcsRUFBRSxJQUFJO2dCQUNqQixRQUFRLEVBQUUsS0FBSztnQkFDZixPQUFPLEVBQUUsYUFBYSxDQUFDLE1BQU07YUFDOUI7U0FDRixDQUNBLENBQUM7SUFDSixDQUFDO0lBQ0QsTUFBTTtRQUNKLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDO1lBQ2pCLEtBQUssRUFBRSxJQUFJLENBQUMsS0FBSztZQUNqQixNQUFNLEVBQUU7Z0JBQ04sV0FBVyxFQUFFLEtBQUs7Z0JBQ2xCLFdBQVcsRUFBRSxLQUFLO2dCQUNsQixRQUFRLEVBQUUsSUFBSTtnQkFDZCxPQUFPLEVBQUUsYUFBYSxDQUFDLEtBQUs7YUFDN0I7U0FDRixDQUNBLENBQUM7SUFDSixDQUFDO0lBQ0QsS0FBSztRQUNILElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNsQixDQUFDO0lBR0QsY0FBYztRQUNaLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxpQkFBaUIsRUFBRTtZQUNsQyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUM7U0FDakI7SUFDSCxDQUFDO0lBQ0QsWUFBWSxDQUFDLEVBQVM7UUFDcEIsRUFBRSxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ3BCLEVBQUUsQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN2QixDQUFDOzhHQXhEVSxzQkFBc0I7a0dBQXRCLHNCQUFzQiwyRENWbkMsb25IQTBFTTs7U0RoRU8sc0JBQXNCOzJGQUF0QixzQkFBc0I7a0JBTGxDLFNBQVM7K0JBQ0UscUJBQXFCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBbGVydE9wdGlvbnMgfSBmcm9tICcuLi9tb2RlbHMvb3B0aW9ucyc7XG5pbXBvcnQgeyBPYnNlcnZhYmxlLCBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBBbGVydFJlc3VsdCwgRGlzbWlzc1JlYXNvbiB9IGZyb20gJy4uL21vZGVscy9hbGVydC1yZXN1bHQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdsaWItbmd4LWFsZXJ0LW1vZGFsJyxcbiAgdGVtcGxhdGVVcmw6ICduZ3gtYWxlcnQtbW9kYWwuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9uZ3gtYWxlcnQtbW9kYWwuY29tcG9uZW50LnNjc3MnLCAnLi9uZ3gtYWxlcnQtaWNvbnMuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIE5neEFsZXJ0TW9kYWxDb21wb25lbnQge1xuICBvcHRpb25zITogQWxlcnRPcHRpb25zO1xuICBpbmRleCA9IDA7XG5cbiAgcHJpdmF0ZSByZWFkb25seSBfb25DbG9zZSA9IG5ldyBTdWJqZWN0PHsgaW5kZXg6IG51bWJlciwgcmVzdWx0OiBBbGVydFJlc3VsdDxhbnk+IH0+KCk7XG4gIHB1YmxpYyBvbkNsb3NlID0gdGhpcy5fb25DbG9zZS5hc09ic2VydmFibGUoKTtcblxuICBvbkNvbmZpcm0oKSB7XG4gICAgdGhpcy5fb25DbG9zZS5uZXh0KHtcbiAgICAgIGluZGV4OiB0aGlzLmluZGV4LFxuICAgICAgcmVzdWx0OiB7XG4gICAgICAgIGlzQ29uZmlybWVkOiB0cnVlLFxuICAgICAgICBpc0Rpc21pc3NlZDogZmFsc2UsXG4gICAgICAgIGlzRGVuaWVkOiBmYWxzZSxcbiAgICAgICAgZGlzbWlzczogRGlzbWlzc1JlYXNvbi5jbG9zZSxcbiAgICAgIH1cbiAgICB9XG4gICAgKTtcbiAgfVxuICBvbkNhbmNlbCgpIHtcbiAgICB0aGlzLl9vbkNsb3NlLm5leHQoe1xuICAgICAgaW5kZXg6IHRoaXMuaW5kZXgsXG4gICAgICByZXN1bHQ6IHtcbiAgICAgICAgaXNDb25maXJtZWQ6IGZhbHNlLFxuICAgICAgICBpc0Rpc21pc3NlZDogdHJ1ZSxcbiAgICAgICAgaXNEZW5pZWQ6IGZhbHNlLFxuICAgICAgICBkaXNtaXNzOiBEaXNtaXNzUmVhc29uLmNhbmNlbCxcbiAgICAgIH1cbiAgICB9XG4gICAgKTtcbiAgfVxuICBvbkRlbnkoKSB7XG4gICAgdGhpcy5fb25DbG9zZS5uZXh0KHtcbiAgICAgIGluZGV4OiB0aGlzLmluZGV4LFxuICAgICAgcmVzdWx0OiB7XG4gICAgICAgIGlzQ29uZmlybWVkOiBmYWxzZSxcbiAgICAgICAgaXNEaXNtaXNzZWQ6IGZhbHNlLFxuICAgICAgICBpc0RlbmllZDogdHJ1ZSxcbiAgICAgICAgZGlzbWlzczogRGlzbWlzc1JlYXNvbi5jbG9zZSxcbiAgICAgIH1cbiAgICB9XG4gICAgKTtcbiAgfVxuICBjbG9zZSgpIHtcbiAgICB0aGlzLm9uQ2FuY2VsKCk7XG4gIH1cblxuXG4gIG9uT3V0U2lkZUNsaWNrKCkge1xuICAgIGlmICh0aGlzLm9wdGlvbnMuYWxsb3dPdXRzaWRlQ2xpY2spIHtcbiAgICAgIHRoaXMub25DYW5jZWwoKTtcbiAgICB9XG4gIH1cbiAgaW5uZXJPbkNsaWNrKGV2OiBFdmVudCkge1xuICAgIGV2LnByZXZlbnREZWZhdWx0KCk7XG4gICAgZXYuc3RvcFByb3BhZ2F0aW9uKCk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJuZ3gtYWxlcnQtY29udGFpbmVyXCIgKGNsaWNrKT1cIm9uT3V0U2lkZUNsaWNrKClcIiBbbmdDbGFzc109XCJvcHRpb25zLmNvbnRhaW5lckNsYXNzXCJcclxuICAgIFtjbGFzcy5oYXMtYmFja2Ryb3BdPVwib3B0aW9ucy5iYWNrZHJvcFwiPlxyXG4gICAgPGRpdiBjbGFzcz1cIm5neC1hbGVydC1pbm5lclwiIChjbGljayk9XCJpbm5lck9uQ2xpY2soJGV2ZW50KVwiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJuZ3gtYWxlcnQtaGVhZGVyXCI+XHJcbiAgICAgICAgICAgIDxidXR0b24gY2xhc3M9XCJuZ3gtYWxlcnQtY2xvc2VcIiAoY2xpY2spPVwiY2xvc2UoKVwiICpuZ0lmPVwib3B0aW9ucy5zaG93Q2xvc2VCdXR0b25cIj5cclxuICAgICAgICAgICAgICAgIDxzdmcgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiIHZpZXdCb3g9XCIwIDAgMzIwIDUxMlwiPlxyXG4gICAgICAgICAgICAgICAgICAgIDxwYXRoXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIGQ9XCJNMzEyLjEgMzc1YzkuMzY5IDkuMzY5IDkuMzY5IDI0LjU3IDAgMzMuOTRzLTI0LjU3IDkuMzY5LTMzLjk0IDBMMTYwIDI4OS45bC0xMTkgMTE5Yy05LjM2OSA5LjM2OS0yNC41NyA5LjM2OS0zMy45NCAwcy05LjM2OS0yNC41NyAwLTMzLjk0TDEyNi4xIDI1Nkw3LjAyNyAxMzYuMWMtOS4zNjktOS4zNjktOS4zNjktMjQuNTcgMC0zMy45NHMyNC41Ny05LjM2OSAzMy45NCAwTDE2MCAyMjIuMWwxMTktMTE5YzkuMzY5LTkuMzY5IDI0LjU3LTkuMzY5IDMzLjk0IDBzOS4zNjkgMjQuNTcgMCAzMy45NEwxOTMuOSAyNTZMMzEyLjEgMzc1elwiIC8+XHJcbiAgICAgICAgICAgICAgICA8L3N2Zz5cclxuICAgICAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgPC9kaXY+XHJcblxyXG4gICAgICAgIDwhLS0gLS0tLS0tLS0tIGljb24gLS0tLS0tLS0gLS0+XHJcbiAgICAgICAgPG5nLWNvbnRhaW5lciBbbmdTd2l0Y2hdPVwib3B0aW9ucy5pY29uXCI+XHJcblxyXG5cclxuICAgICAgICAgICAgPGRpdiAqbmdTd2l0Y2hDYXNlPVwiJ3N1Y2Nlc3MnXCIgY2xhc3M9XCJhbGVydC1pY29uIGFsZXJ0LXN1Y2Nlc3MgYWxlcnQtaWNvbi1zaG93XCIgc3R5bGU9XCJkaXNwbGF5OiBmbGV4O1wiPlxyXG4gICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImFsZXJ0LXN1Y2Nlc3MtY2lyY3VsYXItbGluZS1sZWZ0XCI+PC9kaXY+XHJcbiAgICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImFsZXJ0LXN1Y2Nlc3MtbGluZS10aXBcIj48L3NwYW4+IDxzcGFuIGNsYXNzPVwiYWxlcnQtc3VjY2Vzcy1saW5lLWxvbmdcIj48L3NwYW4+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiYWxlcnQtc3VjY2Vzcy1yaW5nXCI+PC9kaXY+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiYWxlcnQtc3VjY2Vzcy1maXhcIj48L2Rpdj5cclxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJhbGVydC1zdWNjZXNzLWNpcmN1bGFyLWxpbmUtcmlnaHRcIj48L2Rpdj5cclxuICAgICAgICAgICAgPC9kaXY+XHJcblxyXG5cclxuICAgICAgICAgICAgPGRpdiAqbmdTd2l0Y2hDYXNlPVwiJ2Vycm9yJ1wiIGNsYXNzPVwiYWxlcnQtaWNvbiBhbGVydC1lcnJvciBhbGVydC1pY29uLXNob3dcIiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7XCI+XHJcbiAgICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImFsZXJ0LXgtbWFya1wiPlxyXG4gICAgICAgICAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiYWxlcnQteC1tYXJrLWxpbmUtbGVmdFwiPjwvc3Bhbj5cclxuICAgICAgICAgICAgICAgICAgICA8c3BhbiBjbGFzcz1cImFsZXJ0LXgtbWFyay1saW5lLXJpZ2h0XCI+PC9zcGFuPlxyXG4gICAgICAgICAgICAgICAgPC9zcGFuPlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuXHJcblxyXG4gICAgICAgICAgICA8ZGl2ICpuZ1N3aXRjaENhc2U9XCInaW5mbydcIiBjbGFzcz1cImFsZXJ0LWljb24gYWxlcnQtaW5mbyBhbGVydC1pY29uLXNob3dcIiBzdHlsZT1cImRpc3BsYXk6IGZsZXg7XCI+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiYWxlcnQtaWNvbi1jb250ZW50XCI+aTwvZGl2PlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuXHJcblxyXG4gICAgICAgICAgICA8ZGl2ICpuZ1N3aXRjaENhc2U9XCIncXVlc3Rpb24nXCIgY2xhc3M9XCJhbGVydC1pY29uIGFsZXJ0LXF1ZXN0aW9uIGFsZXJ0LWljb24tc2hvd1wiIHN0eWxlPVwiZGlzcGxheTogZmxleDtcIj5cclxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJhbGVydC1pY29uLWNvbnRlbnRcIj4/PC9kaXY+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG5cclxuXHJcbiAgICAgICAgICAgIDxkaXYgKm5nU3dpdGNoQ2FzZT1cIid3YXJuaW5nJ1wiIGNsYXNzPVwiYWxlcnQtaWNvbiBhbGVydC13YXJuaW5nIGFsZXJ0LWljb24tc2hvd1wiIHN0eWxlPVwiZGlzcGxheTogZmxleDtcIj5cclxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJhbGVydC1pY29uLWNvbnRlbnRcIj4hPC9kaXY+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG5cclxuXHJcbiAgICAgICAgPC9uZy1jb250YWluZXI+XHJcbiAgICAgICAgPCEtLSAtLS0tLS0tLS0gL2ljb24gLS0tLS0tLS0gLS0+XHJcblxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJuZ3gtYWxlcnQtdGl0bGVcIj5cclxuICAgICAgICAgICAge3tvcHRpb25zLnRpdGxlfX1cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwibmd4LWFsZXJ0LWJvZHlcIj5cclxuICAgICAgICAgICAge3tvcHRpb25zLnRleHR9fVxyXG4gICAgICAgICAgICA8c3BhbiBbaW5uZXJIVE1MXT1cIm9wdGlvbnMuaHRtbFwiPjwvc3Bhbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwibmd4LWFsZXJ0LWZvb3RlclwiPlxyXG4gICAgICAgICAgICA8YnV0dG9uICpuZ0lmPVwib3B0aW9ucy5zaG93Q29uZmlybUJ1dHRvblwiIGNsYXNzPVwiYnRuLWNvbmZpcm1cIiAoY2xpY2spPVwib25Db25maXJtKClcIlxyXG4gICAgICAgICAgICAgICAgW2F0dHIuYXJpYS1sYWJlbF09XCJvcHRpb25zLmNvbmZpcm1CdXR0b25BcmlhTGFiZWxcIj5cclxuICAgICAgICAgICAgICAgIHt7b3B0aW9ucy5jb25maXJtQnV0dG9uVGV4dH19XHJcbiAgICAgICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICAgICAgICA8YnV0dG9uICpuZ0lmPVwib3B0aW9ucy5zaG93Q2FuY2VsQnV0dG9uXCIgY2xhc3M9XCJidG4tY2FuY2VsXCIgKGNsaWNrKT1cIm9uQ2FuY2VsKClcIlxyXG4gICAgICAgICAgICAgICAgW2F0dHIuYXJpYS1sYWJlbF09XCJvcHRpb25zLmNhbmNlbEJ1dHRvbkFyaWFMYWJlbFwiPlxyXG4gICAgICAgICAgICAgICAge3tvcHRpb25zLmNhbmNlbEJ1dHRvblRleHR9fVxyXG4gICAgICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgICAgICAgPGJ1dHRvbiAqbmdJZj1cIm9wdGlvbnMuc2hvd0RlbnlCdXR0b25cIiBjbGFzcz1cImJ0bi1kZW55XCIgKGNsaWNrKT1cIm9uRGVueSgpXCJcclxuICAgICAgICAgICAgICAgIFthdHRyLmFyaWEtbGFiZWxdPVwib3B0aW9ucy5kZW55QnV0dG9uQXJpYUxhYmVsXCI+XHJcbiAgICAgICAgICAgICAgICB7e29wdGlvbnMuZGVueUJ1dHRvblRleHR9fVxyXG4gICAgICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG5cclxuPC9kaXY+Il19
|
|
@@ -196,11 +196,11 @@ class NgxAlertModalComponent {
|
|
|
196
196
|
ev.stopPropagation();
|
|
197
197
|
}
|
|
198
198
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: NgxAlertModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
199
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: NgxAlertModalComponent, selector: "lib-ngx-alert-modal", ngImport: i0, template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] }); }
|
|
199
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: NgxAlertModalComponent, selector: "lib-ngx-alert-modal", ngImport: i0, template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999;inset:0}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] }); }
|
|
200
200
|
}
|
|
201
201
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: NgxAlertModalComponent, decorators: [{
|
|
202
202
|
type: Component,
|
|
203
|
-
args: [{ selector: 'lib-ngx-alert-modal', template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"] }]
|
|
203
|
+
args: [{ selector: 'lib-ngx-alert-modal', template: "<div class=\"ngx-alert-container\" (click)=\"onOutSideClick()\" [ngClass]=\"options.containerClass\"\r\n [class.has-backdrop]=\"options.backdrop\">\r\n <div class=\"ngx-alert-inner\" (click)=\"innerOnClick($event)\">\r\n <div class=\"ngx-alert-header\">\r\n <button class=\"ngx-alert-close\" (click)=\"close()\" *ngIf=\"options.showCloseButton\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\r\n <path\r\n d=\"M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <!-- --------- icon -------- -->\r\n <ng-container [ngSwitch]=\"options.icon\">\r\n\r\n\r\n <div *ngSwitchCase=\"'success'\" class=\"alert-icon alert-success alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-success-circular-line-left\"></div>\r\n <span class=\"alert-success-line-tip\"></span> <span class=\"alert-success-line-long\"></span>\r\n <div class=\"alert-success-ring\"></div>\r\n <div class=\"alert-success-fix\"></div>\r\n <div class=\"alert-success-circular-line-right\"></div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'error'\" class=\"alert-icon alert-error alert-icon-show\" style=\"display: flex;\">\r\n <span class=\"alert-x-mark\">\r\n <span class=\"alert-x-mark-line-left\"></span>\r\n <span class=\"alert-x-mark-line-right\"></span>\r\n </span>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'info'\" class=\"alert-icon alert-info alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">i</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'question'\" class=\"alert-icon alert-question alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">?</div>\r\n </div>\r\n\r\n\r\n <div *ngSwitchCase=\"'warning'\" class=\"alert-icon alert-warning alert-icon-show\" style=\"display: flex;\">\r\n <div class=\"alert-icon-content\">!</div>\r\n </div>\r\n\r\n\r\n </ng-container>\r\n <!-- --------- /icon -------- -->\r\n\r\n <div class=\"ngx-alert-title\">\r\n {{options.title}}\r\n </div>\r\n <div class=\"ngx-alert-body\">\r\n {{options.text}}\r\n <span [innerHTML]=\"options.html\"></span>\r\n </div>\r\n <div class=\"ngx-alert-footer\">\r\n <button *ngIf=\"options.showConfirmButton\" class=\"btn-confirm\" (click)=\"onConfirm()\"\r\n [attr.aria-label]=\"options.confirmButtonAriaLabel\">\r\n {{options.confirmButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showCancelButton\" class=\"btn-cancel\" (click)=\"onCancel()\"\r\n [attr.aria-label]=\"options.cancelButtonAriaLabel\">\r\n {{options.cancelButtonText}}\r\n </button>\r\n <button *ngIf=\"options.showDenyButton\" class=\"btn-deny\" (click)=\"onDeny()\"\r\n [attr.aria-label]=\"options.denyButtonAriaLabel\">\r\n {{options.denyButtonText}}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n</div>", styles: [".ngx-alert-container{position:fixed;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:9999;inset:0}.ngx-alert-container.has-backdrop{background:rgba(0,0,0,.1176470588)}.ngx-alert-container .ngx-alert-inner{background-color:#fff;box-shadow:0 0 36px #00000029;min-width:400px;min-height:150px;border-radius:6px;animation:ShowAlert .3s}.ngx-alert-container .ngx-alert-header{display:flex;align-items:center;font-size:30px;min-height:40px}.ngx-alert-container .ngx-alert-header .ngx-alert-close{background:none;border:none;outline:none;cursor:pointer}.ngx-alert-container .ngx-alert-header .ngx-alert-close svg{width:20px;height:20px}.ngx-alert-container .ngx-alert-body{padding:15px;text-align:center;max-height:calc(100vh - 120px);overflow:auto}.ngx-alert-container .ngx-alert-title{padding:15px;text-align:center}.ngx-alert-container .ngx-alert-footer{display:flex;align-items:center;flex-wrap:wrap;padding:15px;gap:6px;justify-content:center}.ngx-alert-container .ngx-alert-footer button{background:none;border:none;background-color:#007bff;color:#fff;padding:8px 15px;border-radius:3px;cursor:pointer}.ngx-alert-container .ngx-alert-footer button.btn-confirm{background-color:#007bff}.ngx-alert-container .ngx-alert-footer button.btn-cancel{background-color:#6e7881}.ngx-alert-container .ngx-alert-footer button.btn-deny{background-color:#dc3741}@keyframes ShowAlert{0%{transform:scale(.7)}45%{transform:scale(1.05)}80%{transform:scale(.95)}to{transform:scale(1)}}\n", ".alert-icon{position:relative;box-sizing:content-box;justify-content:center;width:5em;height:5em;margin:.5em auto .6em;border:.25em solid rgba(0,0,0,0);border-radius:50%;border-color:#000;font-family:inherit;line-height:5em;cursor:default;-webkit-user-select:none;user-select:none}.alert-icon .alert-icon-content{display:flex;align-items:center;font-size:3.75em}.alert-icon.alert-error{border-color:#f27474;color:#f27474}.alert-icon.alert-error .alert-x-mark{position:relative;flex-grow:1}.alert-icon.alert-error [class^=alert-x-mark-line]{display:block;position:absolute;top:2.3125em;width:2.9375em;height:.3125em;border-radius:.125em;background-color:#f27474}.alert-icon.alert-error [class^=alert-x-mark-line][class$=left]{left:1.0625em;transform:rotate(45deg)}.alert-icon.alert-error [class^=alert-x-mark-line][class$=right]{right:1em;transform:rotate(-45deg)}.alert-icon.alert-error.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-error.alert-icon-show .alert-x-mark{animation:alert-animate-error-x-mark .5s}.alert-icon.alert-warning{border-color:#facea8;color:#f8bb86}.alert-icon.alert-warning.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-warning.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .5s}.alert-icon.alert-info{border-color:#9de0f6;color:#3fc3ee}.alert-icon.alert-info.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-info.alert-icon-show .alert-icon-content{animation:alert-animate-i-mark .8s}.alert-icon.alert-question{border-color:#c9dae1;color:#87adbd}.alert-icon.alert-question.alert-icon-show{animation:alert-animate-error-icon .5s}.alert-icon.alert-question.alert-icon-show .alert-icon-content{animation:alert-animate-question-mark .8s}.alert-icon.alert-success{border-color:#a5dc86;color:#a5dc86}.alert-icon.alert-success [class^=alert-success-circular-line]{position:absolute;width:3.75em;height:7.5em;transform:rotate(45deg);border-radius:50%}.alert-icon.alert-success [class^=alert-success-circular-line][class$=left]{top:-.4375em;left:-2.0635em;transform:rotate(-45deg);transform-origin:3.75em 3.75em;border-radius:7.5em 0 0 7.5em}.alert-icon.alert-success [class^=alert-success-circular-line][class$=right]{top:-.6875em;left:1.875em;transform:rotate(-45deg);transform-origin:0 3.75em;border-radius:0 7.5em 7.5em 0}.alert-icon.alert-success .alert-success-ring{position:absolute;z-index:2;top:-.25em;left:-.25em;box-sizing:content-box;width:100%;height:100%;border:.25em solid rgba(165,220,134,.3);border-radius:50%}.alert-icon.alert-success .alert-success-fix{position:absolute;z-index:1;top:.5em;left:1.625em;width:.4375em;height:5.625em;transform:rotate(-45deg)}.alert-icon.alert-success [class^=alert-success-line]{display:block;position:absolute;z-index:2;height:.3125em;border-radius:.125em;background-color:#a5dc86}.alert-icon.alert-success [class^=alert-success-line][class$=tip]{top:2.875em;left:.8125em;width:1.5625em;transform:rotate(45deg)}.alert-icon.alert-success [class^=alert-success-line][class$=long]{top:2.375em;right:.5em;width:2.9375em;transform:rotate(-45deg)}.alert-icon.alert-success.alert-icon-show .alert-success-line-tip{animation:alert-animate-success-line-tip .75s}.alert-icon.alert-success.alert-icon-show .alert-success-line-long{animation:alert-animate-success-line-long .75s}.alert-icon.alert-success.alert-icon-show .alert-success-circular-line-right{animation:alert-rotate-success-circular-line 4.25s ease-in}@keyframes alert-toast-animate-success-line-tip{0%{top:.5625em;left:.0625em;width:0}54%{top:.125em;left:.125em;width:0}70%{top:.625em;left:-.25em;width:1.625em}84%{top:1.0625em;left:.75em;width:.5em}to{top:1.125em;left:.1875em;width:.75em}}@keyframes alert-toast-animate-success-line-long{0%{top:1.625em;right:1.375em;width:0}65%{top:1.25em;right:.9375em;width:0}84%{top:.9375em;right:0;width:1.125em}to{top:.9375em;right:.1875em;width:1.375em}}@keyframes alert-animate-success-line-tip{0%{top:1.1875em;left:.0625em;width:0}54%{top:1.0625em;left:.125em;width:0}70%{top:2.1875em;left:-.375em;width:3.125em}84%{top:3em;left:1.3125em;width:1.0625em}to{top:2.8125em;left:.8125em;width:1.5625em}}@keyframes alert-animate-success-line-long{0%{top:3.375em;right:2.875em;width:0}65%{top:3.375em;right:2.875em;width:0}84%{top:2.1875em;right:0;width:3.4375em}to{top:2.375em;right:.5em;width:2.9375em}}@keyframes alert-rotate-success-circular-line{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes alert-animate-error-x-mark{0%{margin-top:1.625em;transform:scale(.4);opacity:0}50%{margin-top:1.625em;transform:scale(.4);opacity:0}80%{margin-top:-.375em;transform:scale(1.15)}to{margin-top:0;transform:scale(1);opacity:1}}@keyframes alert-animate-error-icon{0%{transform:rotateX(100deg);opacity:0}to{transform:rotateX(0);opacity:1}}@keyframes alert-rotate-loading{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes alert-animate-question-mark{0%{transform:rotateY(-360deg)}to{transform:rotateY(0)}}@keyframes alert-animate-i-mark{0%{transform:rotate(45deg);opacity:0}25%{transform:rotate(-25deg);opacity:.4}50%{transform:rotate(15deg);opacity:.8}75%{transform:rotate(-5deg);opacity:1}to{transform:rotateX(0);opacity:1}}\n"] }]
|
|
204
204
|
}] });
|
|
205
205
|
|
|
206
206
|
class NgxAlertModalService {
|