@acorex/components 16.19.11 → 16.19.12
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.
|
@@ -6,7 +6,7 @@ import * as i1 from '@angular/cdk/overlay';
|
|
|
6
6
|
import { OverlayContainer, Overlay, OverlayModule } from '@angular/cdk/overlay';
|
|
7
7
|
import * as i1$3 from '@angular/cdk/portal';
|
|
8
8
|
import { TemplatePortal, ComponentPortal, CdkPortalOutlet, PortalModule } from '@angular/cdk/portal';
|
|
9
|
-
import { merge, Subject, Observable, debounceTime as debounceTime$1, takeUntil
|
|
9
|
+
import { merge, Subject, Observable, debounceTime as debounceTime$1, takeUntil } from 'rxjs';
|
|
10
10
|
import * as i2 from '@angular/cdk/bidi';
|
|
11
11
|
import * as i1$1 from '@angular/common';
|
|
12
12
|
import { DOCUMENT, CommonModule } from '@angular/common';
|
|
@@ -5653,6 +5653,7 @@ class AXToastMessageComponent {
|
|
|
5653
5653
|
constructor(elRef) {
|
|
5654
5654
|
this.elRef = elRef;
|
|
5655
5655
|
}
|
|
5656
|
+
progressBar;
|
|
5656
5657
|
title = '';
|
|
5657
5658
|
message;
|
|
5658
5659
|
timeOut = 6000;
|
|
@@ -5662,17 +5663,24 @@ class AXToastMessageComponent {
|
|
|
5662
5663
|
icon = '';
|
|
5663
5664
|
toastWidth = signal(100);
|
|
5664
5665
|
intervalSubscription;
|
|
5665
|
-
|
|
5666
|
-
if (this.
|
|
5667
|
-
|
|
5668
|
-
|
|
5669
|
-
this.toastWidth.update((prev) => prev - 1);
|
|
5670
|
-
if (this.toastWidth() === 0) {
|
|
5671
|
-
this.intervalSubscription.unsubscribe();
|
|
5672
|
-
this.close();
|
|
5673
|
-
}
|
|
5666
|
+
ngAfterViewInit() {
|
|
5667
|
+
if (this.progressBar) {
|
|
5668
|
+
this.progressBar.nativeElement.addEventListener('animationend', () => {
|
|
5669
|
+
this.close();
|
|
5674
5670
|
});
|
|
5675
5671
|
}
|
|
5672
|
+
}
|
|
5673
|
+
ngOnInit() {
|
|
5674
|
+
// if (this.timeOut) {
|
|
5675
|
+
// const intervalDuration = this.timeOut / 100;
|
|
5676
|
+
// this.intervalSubscription = interval(intervalDuration).subscribe(() => {
|
|
5677
|
+
// this.toastWidth.update((prev) => prev - 1);
|
|
5678
|
+
// if (this.toastWidth() === 0) {
|
|
5679
|
+
// this.intervalSubscription.unsubscribe();
|
|
5680
|
+
// this.close();
|
|
5681
|
+
// }
|
|
5682
|
+
// });
|
|
5683
|
+
// }
|
|
5676
5684
|
switch (this.type) {
|
|
5677
5685
|
case 'success':
|
|
5678
5686
|
this.style = 'success';
|
|
@@ -5706,12 +5714,15 @@ class AXToastMessageComponent {
|
|
|
5706
5714
|
this.elRef.nativeElement.parentElement.removeChild(this.elRef.nativeElement);
|
|
5707
5715
|
}
|
|
5708
5716
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXToastMessageComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5709
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AXToastMessageComponent, isStandalone: false, selector: "ng-component", inputs: { title: "title", message: "message", timeOut: "timeOut", closeable: "closeable", type: "type" }, ngImport: i0, template: "@if (toastWidth()) {\n<div class=\"toast-container\">\n @if (title) {\n <header class=\"ax toast {{ style }}\">\n <div><i class=\"{{ icon }}\"></i> {{ title }}</div>\n @if (closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n </header>\n }\n <div class=\"content ax toast {{ style }}\">\n {{ message }}\n @if (!title && closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n <div
|
|
5717
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AXToastMessageComponent, isStandalone: false, selector: "ng-component", inputs: { title: "title", message: "message", timeOut: "timeOut", closeable: "closeable", type: "type" }, viewQueries: [{ propertyName: "progressBar", first: true, predicate: ["progressBar"], descendants: true }], ngImport: i0, template: "@if (toastWidth()) {\n<div class=\"toast-container\">\n @if (title) {\n <header class=\"ax toast {{ style }}\">\n <div><i class=\"{{ icon }}\"></i> {{ title }}</div>\n @if (closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n </header>\n }\n <div class=\"content ax toast {{ style }}\">\n {{ message }}\n @if (!title && closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n <div\n #progressBar\n class=\"toast-progress\"\n [style.animation-duration.ms]=\"timeOut\"\n ></div>\n </div>\n</div>\n\n}\n", styles: [".rtl .toast-progress{right:0;left:inherit!important}.toast-container{overflow:hidden;margin:.8rem 0;box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b;animation:slide-in-bottom .3s cubic-bezier(.25,.46,.45,.94) both;-webkit-animation:slide-in-bottom .3s cubic-bezier(.25,.46,.45,.94) both;border-radius:var(--ax-size-border-radius)}.toast-container header{display:flex;justify-content:space-between;align-items:center;padding:.5rem .8rem;font-weight:500}.toast-container .content{padding:1rem;display:flex;align-items:center;justify-content:space-between}.toast-container .toast-close{cursor:pointer;font-size:1rem}.toast-container .toast-progress{position:absolute;background:#00000080;width:100%;bottom:0;left:0;height:6px;animation-timing-function:linear;animation-name:progressBar}@keyframes progressBar{0%{width:100%}to{width:0%}}@keyframes slide-in-top{0%{transform:translateY(-1000px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slide-in-bottom{0%{transform:translateY(1000px);opacity:0}to{transform:translateY(0);opacity:1}}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
5710
5718
|
}
|
|
5711
5719
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXToastMessageComponent, decorators: [{
|
|
5712
5720
|
type: Component,
|
|
5713
|
-
args: [{ encapsulation: ViewEncapsulation.None, standalone: false, template: "@if (toastWidth()) {\n<div class=\"toast-container\">\n @if (title) {\n <header class=\"ax toast {{ style }}\">\n <div><i class=\"{{ icon }}\"></i> {{ title }}</div>\n @if (closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n </header>\n }\n <div class=\"content ax toast {{ style }}\">\n {{ message }}\n @if (!title && closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n <div
|
|
5714
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: {
|
|
5721
|
+
args: [{ encapsulation: ViewEncapsulation.None, standalone: false, template: "@if (toastWidth()) {\n<div class=\"toast-container\">\n @if (title) {\n <header class=\"ax toast {{ style }}\">\n <div><i class=\"{{ icon }}\"></i> {{ title }}</div>\n @if (closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n </header>\n }\n <div class=\"content ax toast {{ style }}\">\n {{ message }}\n @if (!title && closeable) {\n <div (click)=\"close()\" class=\"toast-close\">\n <i class=\"far fa-times\"></i>\n </div>\n }\n <div\n #progressBar\n class=\"toast-progress\"\n [style.animation-duration.ms]=\"timeOut\"\n ></div>\n </div>\n</div>\n\n}\n", styles: [".rtl .toast-progress{right:0;left:inherit!important}.toast-container{overflow:hidden;margin:.8rem 0;box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b;animation:slide-in-bottom .3s cubic-bezier(.25,.46,.45,.94) both;-webkit-animation:slide-in-bottom .3s cubic-bezier(.25,.46,.45,.94) both;border-radius:var(--ax-size-border-radius)}.toast-container header{display:flex;justify-content:space-between;align-items:center;padding:.5rem .8rem;font-weight:500}.toast-container .content{padding:1rem;display:flex;align-items:center;justify-content:space-between}.toast-container .toast-close{cursor:pointer;font-size:1rem}.toast-container .toast-progress{position:absolute;background:#00000080;width:100%;bottom:0;left:0;height:6px;animation-timing-function:linear;animation-name:progressBar}@keyframes progressBar{0%{width:100%}to{width:0%}}@keyframes slide-in-top{0%{transform:translateY(-1000px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slide-in-bottom{0%{transform:translateY(1000px);opacity:0}to{transform:translateY(0);opacity:1}}\n"] }]
|
|
5722
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { progressBar: [{
|
|
5723
|
+
type: ViewChild,
|
|
5724
|
+
args: ['progressBar', { static: false }]
|
|
5725
|
+
}], title: [{
|
|
5715
5726
|
type: Input
|
|
5716
5727
|
}], message: [{
|
|
5717
5728
|
type: Input
|