@naniteninja/dashboard-components-lib 2.1.61 → 2.1.62
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.
|
@@ -1729,11 +1729,11 @@ class LibLoadingBarComponent {
|
|
|
1729
1729
|
this.destroy$.complete();
|
|
1730
1730
|
}
|
|
1731
1731
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LibLoadingBarComponent, deps: [{ token: LibToastrService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1732
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: LibLoadingBarComponent, isStandalone: true, selector: "lib-loading-bar", inputs: { toasterLife: "toasterLife" }, ngImport: i0, template: "<div class=\"
|
|
1732
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: LibLoadingBarComponent, isStandalone: true, selector: "lib-loading-bar", inputs: { toasterLife: "toasterLife" }, ngImport: i0, template: "<div class=\"alert-popup-progress\">\n <div\n class=\"alert-popup-progress__inner\"\n [ngClass]=\"mouseOver ? 'alert-popup-progress__inner--mouse-in' : 'alert-popup-progress__inner--mouse-out'\"\n [ngStyle]=\"{ 'animation-duration.ms': toasterLife }\"\n ></div>\n</div>\n", styles: [".alert-popup-progress{position:relative;background-color:var(--tertiary-color);border-radius:30px;height:5px;width:100%;overflow:hidden;margin-top:10px;opacity:.7}.alert-popup-progress__inner{position:absolute;left:0;background-color:var(--secondary-color);height:100%;font-size:12px;display:flex;align-items:center;justify-content:center;border-radius:30px}.alert-popup-progress__inner--mouse-out{animation:linear forwards alert-popup-loading-bar-anime}.alert-popup-progress__inner--mouse-in{width:0}@keyframes alert-popup-loading-bar-anime{0%{width:0}to{width:100%}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1733
1733
|
}
|
|
1734
1734
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: LibLoadingBarComponent, decorators: [{
|
|
1735
1735
|
type: Component,
|
|
1736
|
-
args: [{ selector: 'lib-loading-bar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<div class=\"
|
|
1736
|
+
args: [{ selector: 'lib-loading-bar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule], template: "<div class=\"alert-popup-progress\">\n <div\n class=\"alert-popup-progress__inner\"\n [ngClass]=\"mouseOver ? 'alert-popup-progress__inner--mouse-in' : 'alert-popup-progress__inner--mouse-out'\"\n [ngStyle]=\"{ 'animation-duration.ms': toasterLife }\"\n ></div>\n</div>\n", styles: [".alert-popup-progress{position:relative;background-color:var(--tertiary-color);border-radius:30px;height:5px;width:100%;overflow:hidden;margin-top:10px;opacity:.7}.alert-popup-progress__inner{position:absolute;left:0;background-color:var(--secondary-color);height:100%;font-size:12px;display:flex;align-items:center;justify-content:center;border-radius:30px}.alert-popup-progress__inner--mouse-out{animation:linear forwards alert-popup-loading-bar-anime}.alert-popup-progress__inner--mouse-in{width:0}@keyframes alert-popup-loading-bar-anime{0%{width:0}to{width:100%}}\n"] }]
|
|
1737
1737
|
}], ctorParameters: () => [{ type: LibToastrService }, { type: i0.ChangeDetectorRef }], propDecorators: { toasterLife: [{
|
|
1738
1738
|
type: Input
|
|
1739
1739
|
}] } });
|
|
@@ -1912,11 +1912,11 @@ class AlertPopupComponent {
|
|
|
1912
1912
|
this.changeDetectorRef.detectChanges();
|
|
1913
1913
|
}
|
|
1914
1914
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AlertPopupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: LibToastrService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1915
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: AlertPopupComponent, isStandalone: true, selector: "lib-alert-popup", inputs: { config: "config", title: "title", description: "description", timeState: "timeState", number: "number" }, outputs: { closeClick: "closeClick", closed: "closed", checkboxChange: "checkboxChange" }, providers: [LibToastrService], usesOnChanges: true, ngImport: i0, template: "@if (show) {\n <div\n (mouseover)=\"mouseOver(true)\"\n (mouseleave)=\"mouseOver(false)\"\n class=\"message-box app-toaster-border app-toaster-{{ config.severity }} toaster-{{ config.position || 'right-top' }} {{\n toastrExiting ? 'toaster-' + (config.position || 'right-top') + '--exit' : 'toaster-' + (config.position || 'right-top') + '--enter'\n }}\"\n [ngStyle]=\"{ 'animation-duration.ms': animationDuration }\"\n >\n <div class=\"message-box-wrapper app-toaster-wrapper\">\n <img class=\"message-box-icon\" [src]=\"'./../../../assets/icons/' + toasterIcon\" alt=\"Toster icon\" />\n <div class=\"message-box-content\">\n <h2 class=\"m-0 f-calistoga\">{{ config.title | translate }}</h2>\n @if (config.description.type === 'string') {\n <p class=\"m-0 f-gilroy-medium\">{{ (descriptionContent | translate) || '' }}</p>\n } @else if (config.description.type === 'template') {\n <ng-container *ngTemplateOutlet=\"descriptionTemplate\"></ng-container>\n } @else if (config.description.type === 'button') {\n <p class=\"m-0 f-gilroy-medium message-box-content__button-wrapper\">\n <span>{{ (descriptionContent | translate) || '' }}</span>\n <span class=\"message-box-content__button-wrapper__button\" (click)=\"config.button?.onClick()\"> {{ config.button?.name || '' }} </span>\n </p>\n } @else {\n <!-- No Description Content -->\n }\n @if (config.loading && !config.clickToClose) {\n <lib-loading-bar [toasterLife]=\"toasterLife\"></lib-loading-bar>\n }\n </div>\n <div class=\"app-action-button\">\n @if (!config.hideClose) {\n <span class=\"close-toastr-button absolute top\" (click)=\"onCloseIconClick($event)\" libTooltip=\"Close\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 7 7\" fill=\"none\">\n <path\n d=\"M0.854234 5.69017L5.69106 0.853344M5.78208 5.78237L0.763872 0.764163\"\n stroke=\"#EBEBF5\"\n stroke-opacity=\"0.6\"\n stroke-width=\"1.2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n }\n @if (config.markCheck) {\n @if (!checkbox) {\n <span (click)=\"onCheckboxChange()\" libTooltip=\"Checkbox\" class=\"app-toaster-checkbox\"></span>\n } @else {\n <span class=\"absolute bottom\">\n <img (click)=\"onCheckboxChange()\" libTooltip=\"Checkbox\" src=\"assets/icons/check.svg\" class=\"check-icon\" alt=\"Toster icon\" />\n </span>\n }\n }\n </div>\n </div>\n </div>\n}\n", styles: [":host{--tertiary-color: rgba(255, 255, 255, .6);--secondary-color: rgba(255, 255, 255, .85);--checkbox-border: rgba(254, 60, 114, .4);--accent-pink: #fe3c72;--dark-bg: rgba(26, 23, 30, .85);--primary-toaster-glow-layer: radial-gradient(circle at 10% 50%, rgba(254, 60, 114, .3), transparent 70%);--primary-toaster-transparent-layer: rgba(26, 23, 30, .4);--primary-toaster-error-background: linear-gradient(90deg, #8a335a 1%, #332e39 20%, #6d3c51 60%, #332e39 80%);--primary-toaster-error-border: linear-gradient(160.44deg, #8a335a 1%, #332e39 20%, #6d3c51 60%, #332e39 80%);--primary-toaster-success-background: linear-gradient(90deg, #478857 1%, #332e39 20%, #80d59d 60%, #332e39 80%);--primary-toaster-success-border: linear-gradient(160.44deg, #478857 1%, #332e39 20%, #80d59d 60%, #332e39 80%);--primary-toaster-warning-background: linear-gradient(90deg, #898d4f 1%, #332e39 20%, #ddde8c 60%, #332e39 80%);--primary-toaster-warning-border: linear-gradient(160.44deg, #898d4f 1%, #332e39 20%, #ddde8c 60%, #332e39 80%)}.message-box{position:relative;z-index:1000;display:block;pointer-events:auto;border-radius:12px;box-sizing:border-box}.message-box.app-toaster-border{max-width:320px;width:calc(100vw - 32px);margin:0 auto;padding:1px 0 0;box-shadow:0 10px 30px #00000080;overflow:hidden}.message-box.app-toaster-border:before{content:\"\";position:absolute;inset:0;background-image:var(--primary-toaster-glow-layer);z-index:-1}.message-box.app-toaster-border:after{content:\"\";position:absolute;inset:0;background-image:var(--primary-toaster-transparent-layer);z-index:-1;pointer-events:none}.message-box.app-toaster-border.app-toaster-success{background-image:var(--primary-toaster-success-border)}.message-box.app-toaster-border.app-toaster-warning{background-image:var(--primary-toaster-warning-border)}.message-box.app-toaster-border.app-toaster-error,.message-box.app-toaster-border.app-toaster-info{background-image:var(--primary-toaster-error-border)}.message-box.app-toaster-border.toaster-left-top--enter,.message-box.app-toaster-border.toaster-left-bottom--enter{opacity:0;animation:move-ltr-enter-anime forwards}.message-box.app-toaster-border.toaster-left-top--exit,.message-box.app-toaster-border.toaster-left-bottom--exit{opacity:1;animation:move-rtl-exit-anime forwards}.message-box.app-toaster-border.toaster-right-top--enter,.message-box.app-toaster-border.toaster-right-bottom--enter{opacity:0;animation:move-rtl-enter-anime forwards}.message-box.app-toaster-border.toaster-right-top--exit,.message-box.app-toaster-border.toaster-right-bottom--exit{opacity:1;animation:move-ltr-exit-anime forwards}.message-box-wrapper.app-toaster-wrapper{position:relative;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:11px;overflow:hidden;height:100%;box-sizing:border-box;background:#fff}.message-box-wrapper.app-toaster-wrapper:before{content:\"\";position:absolute;inset:0;z-index:0;opacity:.9}.message-box-wrapper.app-toaster-wrapper:after{content:\"\";position:absolute;inset:1px 0 0;background:#ffffff03;background-blend-mode:overlay;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:0;pointer-events:none}.message-box-icon{width:20px;height:20px;flex-shrink:0;position:relative;z-index:1}.app-toaster-info .message-box-icon,.app-toaster-error .message-box-icon{filter:drop-shadow(0 0 1px #ce769e) brightness(1.1)}.app-toaster-success .message-box-icon{filter:drop-shadow(0 0 1px #3cfe4f) brightness(1.2)}.app-toaster-warning .message-box-icon{filter:drop-shadow(0 0 1px #fafe3c) brightness(1.2)}.message-box-content{flex-grow:1;position:relative;z-index:1;display:flex;flex-direction:column;gap:4px}.message-box-content h2{color:#fff;font-size:14px;font-weight:700;letter-spacing:.02em}.message-box-content p{color:var(--secondary-color);font-size:11px;line-height:1.4}.app-toaster-success .app-toaster-wrapper:before{background-image:var(--primary-toaster-success-background)}.app-toaster-warning .app-toaster-wrapper:before{background-image:var(--primary-toaster-warning-background)}.app-toaster-error .app-toaster-wrapper:before{background-image:var(--primary-toaster-error-background)}.app-toaster-info .app-toaster-wrapper:before{background-image:var(--primary-toaster-error-background)}.app-toaster-success .app-toaster-wrapper:before,.app-toaster-warning .app-toaster-wrapper:before,.app-toaster-error .app-toaster-wrapper:before,.app-toaster-info .app-toaster-wrapper:before{filter:blur(2px);-webkit-filter:blur(2px)}.app-action-button{display:flex;flex-direction:column;justify-content:space-between;min-height:50px;position:relative;z-index:1}.app-action-button .check-icon{position:absolute;bottom:0;width:14px;height:14px}.app-action-button img{cursor:pointer}.app-toaster-checkbox{border:2px solid var(--checkbox-border);display:inline-block;width:9px;height:9px;border-radius:2px;cursor:pointer;position:absolute!important;bottom:0}.absolute{position:absolute!important}.bottom{bottom:0}.bottom-auto{bottom:auto!important}.top{top:0}.close-toastr-button{cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;z-index:1000;top:-3px!important;right:-3px!important;transition:opacity .2s ease;opacity:.5}.close-toastr-button:hover{opacity:.8}.close-toastr-button svg{pointer-events:none}@keyframes move-ltr-enter-anime{0%{transform:translate(-100%) scale(.75);opacity:0}30%{opacity:.5;transform:scale(.75)}to{transform:translate(0) scale(1);opacity:1}}@keyframes move-rtl-exit-anime{0%{transform:translate(0) scale(1);opacity:1}30%{transform:scale(.75);opacity:.5}to{transform:translate(-100%) scale(.75);opacity:0}}@keyframes move-rtl-enter-anime{0%{transform:translate(100%) scale(.75);opacity:0}30%{opacity:.5;transform:scale(.75)}to{transform:translate(0) scale(1);opacity:1}}@keyframes move-ltr-exit-anime{0%{transform:translate(0) scale(1);opacity:1}30%{transform:scale(.75);opacity:.5}to{transform:translate(100%) scale(.75);opacity:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibLoadingBarComponent, selector: "lib-loading-bar", inputs: ["toasterLife"] }, { kind: "ngmodule", type: DirectiveModule }, { kind: "directive", type: i1.LazyImageDirective, selector: "img" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1915
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.19", type: AlertPopupComponent, isStandalone: true, selector: "lib-alert-popup", inputs: { config: "config", title: "title", description: "description", timeState: "timeState", number: "number" }, outputs: { closeClick: "closeClick", closed: "closed", checkboxChange: "checkboxChange" }, providers: [LibToastrService], usesOnChanges: true, ngImport: i0, template: "@if (show) {\n <div\n (mouseover)=\"mouseOver(true)\"\n (mouseleave)=\"mouseOver(false)\"\n class=\"alert-popup-box alert-popup-border alert-popup-{{ config.severity }} alert-popup-{{ config.position || 'right-top' }} {{\n toastrExiting ? 'alert-popup-pos-' + (config.position || 'right-top') + '--exit' : 'alert-popup-pos-' + (config.position || 'right-top') + '--enter'\n }}\"\n [ngStyle]=\"{ 'animation-duration.ms': animationDuration }\"\n >\n <div class=\"alert-popup-wrapper alert-popup-content-wrapper\">\n <img class=\"alert-popup-icon\" [src]=\"'./../../../assets/icons/' + toasterIcon\" alt=\"Toster icon\" />\n <div class=\"alert-popup-content\">\n <h2 class=\"m-0 f-calistoga\">{{ config.title | translate }}</h2>\n @if (config.description.type === 'string') {\n <p class=\"m-0 f-gilroy-medium\">{{ (descriptionContent | translate) || '' }}</p>\n } @else if (config.description.type === 'template') {\n <ng-container *ngTemplateOutlet=\"descriptionTemplate\"></ng-container>\n } @else if (config.description.type === 'button') {\n <p class=\"m-0 f-gilroy-medium alert-popup-content__button-wrapper\">\n <span>{{ (descriptionContent | translate) || '' }}</span>\n <span class=\"alert-popup-content__button-wrapper__button\" (click)=\"config.button?.onClick()\"> {{ config.button?.name || '' }} </span>\n </p>\n } @else {\n <!-- No Description Content -->\n }\n @if (config.loading && !config.clickToClose) {\n <lib-loading-bar [toasterLife]=\"toasterLife\"></lib-loading-bar>\n }\n </div>\n <div class=\"alert-popup-action-button\">\n @if (!config.hideClose) {\n <span class=\"alert-popup-close-button absolute top\" (click)=\"onCloseIconClick($event)\" libTooltip=\"Close\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 7 7\" fill=\"none\">\n <path\n d=\"M0.854234 5.69017L5.69106 0.853344M5.78208 5.78237L0.763872 0.764163\"\n stroke=\"#EBEBF5\"\n stroke-opacity=\"0.6\"\n stroke-width=\"1.2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n }\n @if (config.markCheck) {\n @if (!checkbox) {\n <span (click)=\"onCheckboxChange()\" libTooltip=\"Checkbox\" class=\"alert-popup-checkbox\"></span>\n } @else {\n <span class=\"absolute bottom\">\n <img (click)=\"onCheckboxChange()\" libTooltip=\"Checkbox\" src=\"assets/icons/check.svg\" class=\"alert-popup-check-icon\" alt=\"Toster icon\" />\n </span>\n }\n }\n </div>\n </div>\n </div>\n}\n", styles: [":host{--tertiary-color: rgba(255, 255, 255, .6);--secondary-color: rgba(255, 255, 255, .85);--checkbox-border: rgba(254, 60, 114, .4);--accent-pink: #fe3c72;--dark-bg: rgba(26, 23, 30, .85);--alert-popup-glow-layer: radial-gradient(circle at 10% 50%, rgba(254, 60, 114, .3), transparent 70%);--alert-popup-transparent-layer: rgba(26, 23, 30, .4);--alert-popup-error-background: linear-gradient(90deg, #8a335a 1%, #332e39 20%, #6d3c51 60%, #332e39 80%);--alert-popup-error-border: linear-gradient(160.44deg, #8a335a 1%, #332e39 20%, #6d3c51 60%, #332e39 80%);--alert-popup-success-background: linear-gradient(90deg, #478857 1%, #332e39 20%, #80d59d 60%, #332e39 80%);--alert-popup-success-border: linear-gradient(160.44deg, #478857 1%, #332e39 20%, #80d59d 60%, #332e39 80%);--alert-popup-warning-background: linear-gradient(90deg, #898d4f 1%, #332e39 20%, #ddde8c 60%, #332e39 80%);--alert-popup-warning-border: linear-gradient(160.44deg, #898d4f 1%, #332e39 20%, #ddde8c 60%, #332e39 80%)}.alert-popup-box{position:relative;z-index:1000;display:block;pointer-events:auto;border-radius:12px;box-sizing:border-box}.alert-popup-box.alert-popup-border{max-width:320px;width:calc(100vw - 32px);margin:0 auto;padding:1px 0 0;box-shadow:0 10px 30px #00000080;overflow:hidden}.alert-popup-box.alert-popup-border:before{content:\"\";position:absolute;inset:0;background-image:var(--alert-popup-glow-layer);z-index:-1}.alert-popup-box.alert-popup-border:after{content:\"\";position:absolute;inset:0;background-image:var(--alert-popup-transparent-layer);z-index:-1;pointer-events:none}.alert-popup-box.alert-popup-border.alert-popup-success{background-image:var(--alert-popup-success-border)}.alert-popup-box.alert-popup-border.alert-popup-warning{background-image:var(--alert-popup-warning-border)}.alert-popup-box.alert-popup-border.alert-popup-error,.alert-popup-box.alert-popup-border.alert-popup-info{background-image:var(--alert-popup-error-border)}.alert-popup-box.alert-popup-border.alert-popup-pos-left-top--enter,.alert-popup-box.alert-popup-border.alert-popup-pos-left-bottom--enter{opacity:0;animation:alert-popup-move-ltr-enter-anime forwards}.alert-popup-box.alert-popup-border.alert-popup-pos-left-top--exit,.alert-popup-box.alert-popup-border.alert-popup-pos-left-bottom--exit{opacity:1;animation:alert-popup-move-rtl-exit-anime forwards}.alert-popup-box.alert-popup-border.alert-popup-pos-right-top--enter,.alert-popup-box.alert-popup-border.alert-popup-pos-right-bottom--enter{opacity:0;animation:alert-popup-move-rtl-enter-anime forwards}.alert-popup-box.alert-popup-border.alert-popup-pos-right-top--exit,.alert-popup-box.alert-popup-border.alert-popup-pos-right-bottom--exit{opacity:1;animation:alert-popup-move-ltr-exit-anime forwards}.alert-popup-wrapper.alert-popup-content-wrapper{position:relative;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:11px;overflow:hidden;height:100%;box-sizing:border-box;background:#fff}.alert-popup-wrapper.alert-popup-content-wrapper:before{content:\"\";position:absolute;inset:0;z-index:0;opacity:.9}.alert-popup-wrapper.alert-popup-content-wrapper:after{content:\"\";position:absolute;inset:1px 0 0;background:#ffffff03;background-blend-mode:overlay;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:0;pointer-events:none}.alert-popup-icon{width:20px;height:20px;flex-shrink:0;position:relative;z-index:1}.alert-popup-info .alert-popup-icon,.alert-popup-error .alert-popup-icon{filter:drop-shadow(0 0 1px #ce769e) brightness(1.1)}.alert-popup-success .alert-popup-icon{filter:drop-shadow(0 0 1px #3cfe4f) brightness(1.2)}.alert-popup-warning .alert-popup-icon{filter:drop-shadow(0 0 1px #fafe3c) brightness(1.2)}.alert-popup-content{flex-grow:1;position:relative;z-index:1;display:flex;flex-direction:column;gap:4px}.alert-popup-content h2{color:#fff;font-size:14px;font-weight:700;letter-spacing:.02em}.alert-popup-content p{color:var(--secondary-color);font-size:11px;line-height:1.4}.alert-popup-success .alert-popup-content-wrapper:before{background-image:var(--alert-popup-success-background)}.alert-popup-warning .alert-popup-content-wrapper:before{background-image:var(--alert-popup-warning-background)}.alert-popup-error .alert-popup-content-wrapper:before{background-image:var(--alert-popup-error-background)}.alert-popup-info .alert-popup-content-wrapper:before{background-image:var(--alert-popup-error-background)}.alert-popup-success .alert-popup-content-wrapper:before,.alert-popup-warning .alert-popup-content-wrapper:before,.alert-popup-error .alert-popup-content-wrapper:before,.alert-popup-info .alert-popup-content-wrapper:before{filter:blur(2px);-webkit-filter:blur(2px)}.alert-popup-action-button{display:flex;flex-direction:column;justify-content:space-between;min-height:50px;position:relative;z-index:1}.alert-popup-action-button .alert-popup-check-icon{position:absolute;bottom:0;width:14px;height:14px}.alert-popup-action-button img{cursor:pointer}.alert-popup-checkbox{border:2px solid var(--checkbox-border);display:inline-block;width:9px;height:9px;border-radius:2px;cursor:pointer;position:absolute!important;bottom:0}.absolute{position:absolute!important}.bottom{bottom:0}.bottom-auto{bottom:auto!important}.top{top:0}.alert-popup-close-button{cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;z-index:1000;top:-3px!important;right:-3px!important;transition:opacity .2s ease;opacity:.5}.alert-popup-close-button:hover{opacity:.8}.alert-popup-close-button svg{pointer-events:none}@keyframes alert-popup-move-ltr-enter-anime{0%{transform:translate(-100%) scale(.75);opacity:0}30%{opacity:.5;transform:scale(.75)}to{transform:translate(0) scale(1);opacity:1}}@keyframes alert-popup-move-rtl-exit-anime{0%{transform:translate(0) scale(1);opacity:1}30%{transform:scale(.75);opacity:.5}to{transform:translate(-100%) scale(.75);opacity:0}}@keyframes alert-popup-move-rtl-enter-anime{0%{transform:translate(100%) scale(.75);opacity:0}30%{opacity:.5;transform:scale(.75)}to{transform:translate(0) scale(1);opacity:1}}@keyframes alert-popup-move-ltr-exit-anime{0%{transform:translate(0) scale(1);opacity:1}30%{transform:scale(.75);opacity:.5}to{transform:translate(100%) scale(.75);opacity:0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: LibLoadingBarComponent, selector: "lib-loading-bar", inputs: ["toasterLife"] }, { kind: "ngmodule", type: DirectiveModule }, { kind: "directive", type: i1.LazyImageDirective, selector: "img" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1916
1916
|
}
|
|
1917
1917
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: AlertPopupComponent, decorators: [{
|
|
1918
1918
|
type: Component,
|
|
1919
|
-
args: [{ selector: 'lib-alert-popup', providers: [LibToastrService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, TranslateModule, LibLoadingBarComponent, DirectiveModule], template: "@if (show) {\n <div\n (mouseover)=\"mouseOver(true)\"\n (mouseleave)=\"mouseOver(false)\"\n class=\"
|
|
1919
|
+
args: [{ selector: 'lib-alert-popup', providers: [LibToastrService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [CommonModule, TranslateModule, LibLoadingBarComponent, DirectiveModule], template: "@if (show) {\n <div\n (mouseover)=\"mouseOver(true)\"\n (mouseleave)=\"mouseOver(false)\"\n class=\"alert-popup-box alert-popup-border alert-popup-{{ config.severity }} alert-popup-{{ config.position || 'right-top' }} {{\n toastrExiting ? 'alert-popup-pos-' + (config.position || 'right-top') + '--exit' : 'alert-popup-pos-' + (config.position || 'right-top') + '--enter'\n }}\"\n [ngStyle]=\"{ 'animation-duration.ms': animationDuration }\"\n >\n <div class=\"alert-popup-wrapper alert-popup-content-wrapper\">\n <img class=\"alert-popup-icon\" [src]=\"'./../../../assets/icons/' + toasterIcon\" alt=\"Toster icon\" />\n <div class=\"alert-popup-content\">\n <h2 class=\"m-0 f-calistoga\">{{ config.title | translate }}</h2>\n @if (config.description.type === 'string') {\n <p class=\"m-0 f-gilroy-medium\">{{ (descriptionContent | translate) || '' }}</p>\n } @else if (config.description.type === 'template') {\n <ng-container *ngTemplateOutlet=\"descriptionTemplate\"></ng-container>\n } @else if (config.description.type === 'button') {\n <p class=\"m-0 f-gilroy-medium alert-popup-content__button-wrapper\">\n <span>{{ (descriptionContent | translate) || '' }}</span>\n <span class=\"alert-popup-content__button-wrapper__button\" (click)=\"config.button?.onClick()\"> {{ config.button?.name || '' }} </span>\n </p>\n } @else {\n <!-- No Description Content -->\n }\n @if (config.loading && !config.clickToClose) {\n <lib-loading-bar [toasterLife]=\"toasterLife\"></lib-loading-bar>\n }\n </div>\n <div class=\"alert-popup-action-button\">\n @if (!config.hideClose) {\n <span class=\"alert-popup-close-button absolute top\" (click)=\"onCloseIconClick($event)\" libTooltip=\"Close\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 7 7\" fill=\"none\">\n <path\n d=\"M0.854234 5.69017L5.69106 0.853344M5.78208 5.78237L0.763872 0.764163\"\n stroke=\"#EBEBF5\"\n stroke-opacity=\"0.6\"\n stroke-width=\"1.2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n }\n @if (config.markCheck) {\n @if (!checkbox) {\n <span (click)=\"onCheckboxChange()\" libTooltip=\"Checkbox\" class=\"alert-popup-checkbox\"></span>\n } @else {\n <span class=\"absolute bottom\">\n <img (click)=\"onCheckboxChange()\" libTooltip=\"Checkbox\" src=\"assets/icons/check.svg\" class=\"alert-popup-check-icon\" alt=\"Toster icon\" />\n </span>\n }\n }\n </div>\n </div>\n </div>\n}\n", styles: [":host{--tertiary-color: rgba(255, 255, 255, .6);--secondary-color: rgba(255, 255, 255, .85);--checkbox-border: rgba(254, 60, 114, .4);--accent-pink: #fe3c72;--dark-bg: rgba(26, 23, 30, .85);--alert-popup-glow-layer: radial-gradient(circle at 10% 50%, rgba(254, 60, 114, .3), transparent 70%);--alert-popup-transparent-layer: rgba(26, 23, 30, .4);--alert-popup-error-background: linear-gradient(90deg, #8a335a 1%, #332e39 20%, #6d3c51 60%, #332e39 80%);--alert-popup-error-border: linear-gradient(160.44deg, #8a335a 1%, #332e39 20%, #6d3c51 60%, #332e39 80%);--alert-popup-success-background: linear-gradient(90deg, #478857 1%, #332e39 20%, #80d59d 60%, #332e39 80%);--alert-popup-success-border: linear-gradient(160.44deg, #478857 1%, #332e39 20%, #80d59d 60%, #332e39 80%);--alert-popup-warning-background: linear-gradient(90deg, #898d4f 1%, #332e39 20%, #ddde8c 60%, #332e39 80%);--alert-popup-warning-border: linear-gradient(160.44deg, #898d4f 1%, #332e39 20%, #ddde8c 60%, #332e39 80%)}.alert-popup-box{position:relative;z-index:1000;display:block;pointer-events:auto;border-radius:12px;box-sizing:border-box}.alert-popup-box.alert-popup-border{max-width:320px;width:calc(100vw - 32px);margin:0 auto;padding:1px 0 0;box-shadow:0 10px 30px #00000080;overflow:hidden}.alert-popup-box.alert-popup-border:before{content:\"\";position:absolute;inset:0;background-image:var(--alert-popup-glow-layer);z-index:-1}.alert-popup-box.alert-popup-border:after{content:\"\";position:absolute;inset:0;background-image:var(--alert-popup-transparent-layer);z-index:-1;pointer-events:none}.alert-popup-box.alert-popup-border.alert-popup-success{background-image:var(--alert-popup-success-border)}.alert-popup-box.alert-popup-border.alert-popup-warning{background-image:var(--alert-popup-warning-border)}.alert-popup-box.alert-popup-border.alert-popup-error,.alert-popup-box.alert-popup-border.alert-popup-info{background-image:var(--alert-popup-error-border)}.alert-popup-box.alert-popup-border.alert-popup-pos-left-top--enter,.alert-popup-box.alert-popup-border.alert-popup-pos-left-bottom--enter{opacity:0;animation:alert-popup-move-ltr-enter-anime forwards}.alert-popup-box.alert-popup-border.alert-popup-pos-left-top--exit,.alert-popup-box.alert-popup-border.alert-popup-pos-left-bottom--exit{opacity:1;animation:alert-popup-move-rtl-exit-anime forwards}.alert-popup-box.alert-popup-border.alert-popup-pos-right-top--enter,.alert-popup-box.alert-popup-border.alert-popup-pos-right-bottom--enter{opacity:0;animation:alert-popup-move-rtl-enter-anime forwards}.alert-popup-box.alert-popup-border.alert-popup-pos-right-top--exit,.alert-popup-box.alert-popup-border.alert-popup-pos-right-bottom--exit{opacity:1;animation:alert-popup-move-ltr-exit-anime forwards}.alert-popup-wrapper.alert-popup-content-wrapper{position:relative;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:11px;overflow:hidden;height:100%;box-sizing:border-box;background:#fff}.alert-popup-wrapper.alert-popup-content-wrapper:before{content:\"\";position:absolute;inset:0;z-index:0;opacity:.9}.alert-popup-wrapper.alert-popup-content-wrapper:after{content:\"\";position:absolute;inset:1px 0 0;background:#ffffff03;background-blend-mode:overlay;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:0;pointer-events:none}.alert-popup-icon{width:20px;height:20px;flex-shrink:0;position:relative;z-index:1}.alert-popup-info .alert-popup-icon,.alert-popup-error .alert-popup-icon{filter:drop-shadow(0 0 1px #ce769e) brightness(1.1)}.alert-popup-success .alert-popup-icon{filter:drop-shadow(0 0 1px #3cfe4f) brightness(1.2)}.alert-popup-warning .alert-popup-icon{filter:drop-shadow(0 0 1px #fafe3c) brightness(1.2)}.alert-popup-content{flex-grow:1;position:relative;z-index:1;display:flex;flex-direction:column;gap:4px}.alert-popup-content h2{color:#fff;font-size:14px;font-weight:700;letter-spacing:.02em}.alert-popup-content p{color:var(--secondary-color);font-size:11px;line-height:1.4}.alert-popup-success .alert-popup-content-wrapper:before{background-image:var(--alert-popup-success-background)}.alert-popup-warning .alert-popup-content-wrapper:before{background-image:var(--alert-popup-warning-background)}.alert-popup-error .alert-popup-content-wrapper:before{background-image:var(--alert-popup-error-background)}.alert-popup-info .alert-popup-content-wrapper:before{background-image:var(--alert-popup-error-background)}.alert-popup-success .alert-popup-content-wrapper:before,.alert-popup-warning .alert-popup-content-wrapper:before,.alert-popup-error .alert-popup-content-wrapper:before,.alert-popup-info .alert-popup-content-wrapper:before{filter:blur(2px);-webkit-filter:blur(2px)}.alert-popup-action-button{display:flex;flex-direction:column;justify-content:space-between;min-height:50px;position:relative;z-index:1}.alert-popup-action-button .alert-popup-check-icon{position:absolute;bottom:0;width:14px;height:14px}.alert-popup-action-button img{cursor:pointer}.alert-popup-checkbox{border:2px solid var(--checkbox-border);display:inline-block;width:9px;height:9px;border-radius:2px;cursor:pointer;position:absolute!important;bottom:0}.absolute{position:absolute!important}.bottom{bottom:0}.bottom-auto{bottom:auto!important}.top{top:0}.alert-popup-close-button{cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;z-index:1000;top:-3px!important;right:-3px!important;transition:opacity .2s ease;opacity:.5}.alert-popup-close-button:hover{opacity:.8}.alert-popup-close-button svg{pointer-events:none}@keyframes alert-popup-move-ltr-enter-anime{0%{transform:translate(-100%) scale(.75);opacity:0}30%{opacity:.5;transform:scale(.75)}to{transform:translate(0) scale(1);opacity:1}}@keyframes alert-popup-move-rtl-exit-anime{0%{transform:translate(0) scale(1);opacity:1}30%{transform:scale(.75);opacity:.5}to{transform:translate(-100%) scale(.75);opacity:0}}@keyframes alert-popup-move-rtl-enter-anime{0%{transform:translate(100%) scale(.75);opacity:0}30%{opacity:.5;transform:scale(.75)}to{transform:translate(0) scale(1);opacity:1}}@keyframes alert-popup-move-ltr-exit-anime{0%{transform:translate(0) scale(1);opacity:1}30%{transform:scale(.75);opacity:.5}to{transform:translate(100%) scale(.75);opacity:0}}\n"] }]
|
|
1920
1920
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: LibToastrService }], propDecorators: { config: [{
|
|
1921
1921
|
type: Input
|
|
1922
1922
|
}], title: [{
|