cat-qw-lib 2.3.34 → 2.3.35
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.
package/fesm2022/cat-qw-lib.mjs
CHANGED
|
@@ -5440,6 +5440,11 @@ class WidgetHeaderComponent {
|
|
|
5440
5440
|
headerIconStyle = {};
|
|
5441
5441
|
headerIconClass;
|
|
5442
5442
|
processedBadges = [];
|
|
5443
|
+
widgetStatusIconClass;
|
|
5444
|
+
widgetStatusIconClassExpression;
|
|
5445
|
+
widgetStatusIconStyle = {};
|
|
5446
|
+
widgetStatusIconStyleExpression = {};
|
|
5447
|
+
mergedWidgetStatusIconStyle = {};
|
|
5443
5448
|
constructor(styleBulderService) {
|
|
5444
5449
|
this.styleBulderService = styleBulderService;
|
|
5445
5450
|
}
|
|
@@ -5453,9 +5458,40 @@ class WidgetHeaderComponent {
|
|
|
5453
5458
|
this.headerIconStyle = this.styleBulderService.getItemStyle(parsedHeaderIconStyle);
|
|
5454
5459
|
this.headerIconClass = this.widget.style.headerIconClass;
|
|
5455
5460
|
}
|
|
5461
|
+
// Process widget status icon
|
|
5462
|
+
this.processWidgetStatusIcon();
|
|
5456
5463
|
// Process badges
|
|
5457
5464
|
this.processBadges();
|
|
5458
5465
|
}
|
|
5466
|
+
processWidgetStatusIcon() {
|
|
5467
|
+
// Process widget status icon class (static)
|
|
5468
|
+
this.widgetStatusIconClass = this.widget?.widgetStatusIconClass || '';
|
|
5469
|
+
// Process widget status icon class expression (dynamic)
|
|
5470
|
+
this.widgetStatusIconClassExpression = this.widget?.widgetStatusIconClassExpression
|
|
5471
|
+
? this.widget.widgetStatusIconClassExpression.replace(/^['"]+|['"]+$/g, '')
|
|
5472
|
+
: '';
|
|
5473
|
+
// Process widget status icon style (static)
|
|
5474
|
+
if (this.widget?.widgetStatusIconStyle) {
|
|
5475
|
+
const parsedWidgetStatusIconStyle = this.styleBulderService.parseStyleObject(this.widget.widgetStatusIconStyle);
|
|
5476
|
+
this.widgetStatusIconStyle = this.styleBulderService.getItemStyle(parsedWidgetStatusIconStyle);
|
|
5477
|
+
}
|
|
5478
|
+
else {
|
|
5479
|
+
this.widgetStatusIconStyle = {};
|
|
5480
|
+
}
|
|
5481
|
+
// Process widget status icon style expression (dynamic)
|
|
5482
|
+
if (this.widget?.widgetStatusIconStyleExpression) {
|
|
5483
|
+
const parsedWidgetStatusIconStyleExpression = this.styleBulderService.parseStyleObject(this.widget.widgetStatusIconStyleExpression);
|
|
5484
|
+
this.widgetStatusIconStyleExpression = this.styleBulderService.getItemStyle(parsedWidgetStatusIconStyleExpression);
|
|
5485
|
+
}
|
|
5486
|
+
else {
|
|
5487
|
+
this.widgetStatusIconStyleExpression = {};
|
|
5488
|
+
}
|
|
5489
|
+
// Merge icon styles
|
|
5490
|
+
this.mergedWidgetStatusIconStyle = {
|
|
5491
|
+
...this.widgetStatusIconStyle,
|
|
5492
|
+
...this.widgetStatusIconStyleExpression
|
|
5493
|
+
};
|
|
5494
|
+
}
|
|
5459
5495
|
processBadges() {
|
|
5460
5496
|
this.processedBadges = [];
|
|
5461
5497
|
if (this.widget && this.widget.badges && Array.isArray(this.widget.badges)) {
|
|
@@ -5508,11 +5544,11 @@ class WidgetHeaderComponent {
|
|
|
5508
5544
|
}
|
|
5509
5545
|
}
|
|
5510
5546
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetHeaderComponent, deps: [{ token: StyleBuilderService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5511
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetHeaderComponent, isStandalone: false, selector: "lib-widget-header", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"widget.header || widget.subHeader\" class=\"grid m-0 align-items-center justify-content-between px-3 pt-3\">\r\n <div class=\"col-12 p-0\">\r\n <div class=\"flex align-items-center\">\r\n <i [class]=\"headerIconClass\" [ngStyle]=\"headerIconStyle\"></i>\r\n <h3 [ngStyle]=\"headerStyle\" class=\"m-0 application-title-wrapper\">\r\n {{ (widget.header) }}\r\n </h3>\r\n\r\n <!-- Badges -->\r\n <div *ngIf=\"processedBadges && processedBadges.length > 0\" class=\"flex align-items-center ml-2\">\r\n <span *ngFor=\"let badge of processedBadges\" \r\n class=\"px-2 py-1 rounded font-semibold badge ml-2\"\r\n [ngClass]=\"badge.valueClass\"\r\n [ngStyle]=\"badge.badgeStyle\">\r\n <i *ngIf=\"badge.valueIconClass\" \r\n [ngClass]=\"badge.valueIconClass\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n <i *ngIf=\"badge.valueIconClassExpression\" \r\n [ngClass]=\"badge.valueIconClassExpression\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n {{ badge.value !== 'null' ? badge.value : '' }}\r\n </span>\r\n </div>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span [ngStyle]=\"subHeaderStyle\" class=\"mr-3 font-semibold\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:16px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (min-width: 1200px) and (max-width: 1800px){.application-title-wrapper{font-size:14px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5547
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: WidgetHeaderComponent, isStandalone: false, selector: "lib-widget-header", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"widget.header || widget.subHeader\" class=\"grid m-0 align-items-center justify-content-between px-3 pt-3\">\r\n <div class=\"col-12 p-0\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <div class=\"flex align-items-center\">\r\n <i [class]=\"headerIconClass\" [ngStyle]=\"headerIconStyle\"></i>\r\n <h3 [ngStyle]=\"headerStyle\" class=\"m-0 application-title-wrapper\">\r\n {{ (widget.header) }}\r\n </h3>\r\n\r\n <!-- Badges -->\r\n <div *ngIf=\"processedBadges && processedBadges.length > 0\" class=\"flex align-items-center ml-2\">\r\n <span *ngFor=\"let badge of processedBadges\" \r\n class=\"px-2 py-1 rounded font-semibold badge ml-2\"\r\n [ngClass]=\"badge.valueClass\"\r\n [ngStyle]=\"badge.badgeStyle\">\r\n <i *ngIf=\"badge.valueIconClass\" \r\n [ngClass]=\"badge.valueIconClass\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n <i *ngIf=\"badge.valueIconClassExpression\" \r\n [ngClass]=\"badge.valueIconClassExpression\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n {{ badge.value !== 'null' ? badge.value : '' }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <!-- Widget Status Icon -->\r\n <div class=\"flex align-items-center\">\r\n <i *ngIf=\"widgetStatusIconClass\" [ngClass]=\"widgetStatusIconClass\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\r\n <i *ngIf=\"widgetStatusIconClassExpression\" [ngClass]=\"widgetStatusIconClassExpression\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\r\n </div>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span [ngStyle]=\"subHeaderStyle\" class=\"mr-3 font-semibold\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:16px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (min-width: 1200px) and (max-width: 1800px){.application-title-wrapper{font-size:14px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5512
5548
|
}
|
|
5513
5549
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: WidgetHeaderComponent, decorators: [{
|
|
5514
5550
|
type: Component,
|
|
5515
|
-
args: [{ selector: 'lib-widget-header', standalone: false, template: "<div *ngIf=\"widget.header || widget.subHeader\" class=\"grid m-0 align-items-center justify-content-between px-3 pt-3\">\r\n <div class=\"col-12 p-0\">\r\n <div class=\"flex align-items-center\">\r\n <i [class]=\"headerIconClass\" [ngStyle]=\"headerIconStyle\"></i>\r\n <h3 [ngStyle]=\"headerStyle\" class=\"m-0 application-title-wrapper\">\r\n {{ (widget.header) }}\r\n </h3>\r\n\r\n <!-- Badges -->\r\n <div *ngIf=\"processedBadges && processedBadges.length > 0\" class=\"flex align-items-center ml-2\">\r\n <span *ngFor=\"let badge of processedBadges\" \r\n class=\"px-2 py-1 rounded font-semibold badge ml-2\"\r\n [ngClass]=\"badge.valueClass\"\r\n [ngStyle]=\"badge.badgeStyle\">\r\n <i *ngIf=\"badge.valueIconClass\" \r\n [ngClass]=\"badge.valueIconClass\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n <i *ngIf=\"badge.valueIconClassExpression\" \r\n [ngClass]=\"badge.valueIconClassExpression\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n {{ badge.value !== 'null' ? badge.value : '' }}\r\n </span>\r\n </div>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span [ngStyle]=\"subHeaderStyle\" class=\"mr-3 font-semibold\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:16px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (min-width: 1200px) and (max-width: 1800px){.application-title-wrapper{font-size:14px}}\n"] }]
|
|
5551
|
+
args: [{ selector: 'lib-widget-header', standalone: false, template: "<div *ngIf=\"widget.header || widget.subHeader\" class=\"grid m-0 align-items-center justify-content-between px-3 pt-3\">\r\n <div class=\"col-12 p-0\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <div class=\"flex align-items-center\">\r\n <i [class]=\"headerIconClass\" [ngStyle]=\"headerIconStyle\"></i>\r\n <h3 [ngStyle]=\"headerStyle\" class=\"m-0 application-title-wrapper\">\r\n {{ (widget.header) }}\r\n </h3>\r\n\r\n <!-- Badges -->\r\n <div *ngIf=\"processedBadges && processedBadges.length > 0\" class=\"flex align-items-center ml-2\">\r\n <span *ngFor=\"let badge of processedBadges\" \r\n class=\"px-2 py-1 rounded font-semibold badge ml-2\"\r\n [ngClass]=\"badge.valueClass\"\r\n [ngStyle]=\"badge.badgeStyle\">\r\n <i *ngIf=\"badge.valueIconClass\" \r\n [ngClass]=\"badge.valueIconClass\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n <i *ngIf=\"badge.valueIconClassExpression\" \r\n [ngClass]=\"badge.valueIconClassExpression\" \r\n [ngStyle]=\"badge.mergedValueIconStyle\"\r\n class=\"mr-1\"></i>\r\n {{ badge.value !== 'null' ? badge.value : '' }}\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <!-- Widget Status Icon -->\r\n <div class=\"flex align-items-center\">\r\n <i *ngIf=\"widgetStatusIconClass\" [ngClass]=\"widgetStatusIconClass\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\r\n <i *ngIf=\"widgetStatusIconClassExpression\" [ngClass]=\"widgetStatusIconClassExpression\" [ngStyle]=\"mergedWidgetStatusIconStyle\"></i>\r\n </div>\r\n </div>\r\n <div *ngIf=\"widget?.subHeader\" class=\"flex align-items-center mt-2\">\r\n <span [ngStyle]=\"subHeaderStyle\" class=\"mr-3 font-semibold\">{{ widget.subHeader }}</span>\r\n </div>\r\n </div>\r\n</div>", styles: ["::ng-deep .badge-wrapper .p-button{padding:4px 8px}.application-title-wrapper{font-size:16px;font-weight:600}.chart-container{display:flex;flex-direction:column;align-items:center;justify-content:center}@media screen and (min-width: 1200px) and (max-width: 1800px){.application-title-wrapper{font-size:14px}}\n"] }]
|
|
5516
5552
|
}], ctorParameters: () => [{ type: StyleBuilderService }], propDecorators: { widget: [{
|
|
5517
5553
|
type: Input
|
|
5518
5554
|
}] } });
|