cat-qw-lib 0.59.8 → 0.62.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.
@@ -2539,25 +2539,6 @@ class WidgetAdminService extends BaseService {
2539
2539
  listLabelProperty: "name",
2540
2540
  },
2541
2541
  ];
2542
- /**
2543
- * Cleans and parses a malformed style JSON string
2544
- * @param {string} rawStyleStr - The raw style string from API or DB
2545
- * @returns {Record<string, any> | null} - Parsed style object or null if parsing fails
2546
- */
2547
- sanitizeStyleString(rawStyleStr) {
2548
- try {
2549
- if (!rawStyleStr)
2550
- return {};
2551
- rawStyleStr = rawStyleStr.replace(/""/g, '"');
2552
- rawStyleStr = rawStyleStr.replace(/([{,]\s*)([a-zA-Z0-9_]+)\s*:/g, '$1"$2":');
2553
- const parsed = JSON.parse(rawStyleStr);
2554
- return typeof parsed === 'object' && parsed !== null ? parsed : null;
2555
- }
2556
- catch (err) {
2557
- console.error('Failed to parse style string:', rawStyleStr, err);
2558
- return null;
2559
- }
2560
- }
2561
2542
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetAdminService, deps: [{ token: i1$1.HttpClient }, { token: WidgetAdminStore }, { token: AppConfigService }, { token: ListService }], target: i0.ɵɵFactoryTarget.Injectable });
2562
2543
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetAdminService, providedIn: 'root' });
2563
2544
  }
@@ -2733,20 +2714,6 @@ class WidgetAdminFormComponent extends BaseFormComponent {
2733
2714
  console.error(ERROR.INVALID_INDEX, index);
2734
2715
  }
2735
2716
  }
2736
- handleSubmit() {
2737
- if (typeof this.record.style === 'string') {
2738
- const parsedStyle = this.service.sanitizeStyleString(this.record.style);
2739
- this.record.style = parsedStyle ? parsedStyle : {};
2740
- }
2741
- this.record.dataItems = this.record.dataItems.map((item) => {
2742
- if (typeof item.style === 'string') {
2743
- const parsed = this.service.sanitizeStyleString(item.style);
2744
- item.style = parsed ? parsed : {};
2745
- }
2746
- return item;
2747
- });
2748
- super.handleSubmit();
2749
- }
2750
2717
  ngOnDestroy() {
2751
2718
  this.record = {};
2752
2719
  super.ngOnDestroy();
@@ -4183,30 +4150,13 @@ class StyleBuilderService {
4183
4150
  getStyle(style) {
4184
4151
  if (!style)
4185
4152
  return {};
4186
- if (typeof style === 'string')
4187
- style = this.parseStyleObject(style);
4188
- const itemStyle = typeof style.itemStyle === 'string'
4189
- ? this.parseStyleObject(style.itemStyle)
4190
- : (style.itemStyle || {});
4191
- const styleExpression = typeof style.styleExpression === 'string'
4192
- ? this.parseStyleObject(style.styleExpression)
4193
- : (style.styleExpression || {});
4153
+ const itemStyle = style.itemStyle || {};
4154
+ const styleExpression = style.styleExpression || {};
4194
4155
  return {
4195
4156
  ...this.normalizeStyleObject(itemStyle),
4196
4157
  ...this.normalizeStyleObject(styleExpression),
4197
4158
  };
4198
4159
  }
4199
- parseStyleObject(styleStr) {
4200
- if (!styleStr)
4201
- return {};
4202
- try {
4203
- return JSON.parse(styleStr);
4204
- }
4205
- catch (e) {
4206
- console.warn('Failed to parse style:', styleStr);
4207
- return {};
4208
- }
4209
- }
4210
4160
  normalizeStyleObject(obj) {
4211
4161
  return Object.entries(obj).reduce((acc, [key, value]) => {
4212
4162
  if (value !== undefined && value !== '') {
@@ -4246,13 +4196,10 @@ class WidgetHeaderComponent {
4246
4196
  }
4247
4197
  ngOnChanges(changes) {
4248
4198
  if (this.widget && this.widget.style) {
4249
- const parsedHeaderStyle = this.styleBulderService.parseStyleObject(this.widget.style.headerStyle);
4250
- const parsedSubHeaderStyle = this.styleBulderService.parseStyleObject(this.widget.style.subHeaderStyle);
4251
- const parsedHeaderIconStyle = this.styleBulderService.parseStyleObject(this.widget.style.headerIconStyle);
4252
- this.headerStyle = this.styleBulderService.getItemStyle(parsedHeaderStyle);
4253
- this.subHeaderStyle = this.styleBulderService.getItemStyle(parsedSubHeaderStyle);
4254
- this.headerIconStyle = this.styleBulderService.getItemStyle(parsedHeaderIconStyle);
4199
+ this.headerStyle = this.styleBulderService.getStyle(this.widget.style.headerStyle);
4200
+ this.subHeaderStyle = this.styleBulderService.getStyle(this.widget.style.subHeaderStyle);
4255
4201
  this.headerIconClass = this.widget.style.headerIconClass;
4202
+ this.headerIconStyle = this.styleBulderService.getStyle(this.widget.style.headerIconStyle);
4256
4203
  }
4257
4204
  }
4258
4205
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetHeaderComponent, deps: [{ token: StyleBuilderService }], target: i0.ɵɵFactoryTarget.Component });
@@ -4317,16 +4264,12 @@ class WidgetItemComponent {
4317
4264
  }
4318
4265
  ngOnChanges() {
4319
4266
  if (this.widgetItem && this.widgetItem.style) {
4320
- const parsedValueStyle = this.styleBulderService.parseStyleObject(this.widgetItem.style.value);
4321
- const parsedKeyStyle = this.styleBulderService.parseStyleObject(this.widgetItem.style.key);
4322
- const parsedKeyIconStyle = this.styleBulderService.parseStyleObject(this.widgetItem.style.keyIconStyle);
4323
- const parsedValueIconStyle = this.styleBulderService.parseStyleObject(this.widgetItem.style.valueIconStyle);
4324
- this.fieldValueStyle = this.styleBulderService.getItemStyle(parsedValueStyle);
4325
- this.fieldKeyStyle = this.styleBulderService.getItemStyle(parsedKeyStyle);
4267
+ this.fieldValueStyle = this.styleBulderService.getStyle(this.widgetItem.style.value);
4268
+ this.fieldKeyStyle = this.styleBulderService.getStyle(this.widgetItem.style.key);
4326
4269
  this.keyIconClass = this.widgetItem.style.keyIconClass;
4327
- this.keyIconStyle = this.widgetItem.style.keyIconStyle ? this.styleBulderService.getItemStyle(parsedKeyIconStyle) : {};
4270
+ this.keyIconStyle = this.widgetItem.style.keyIconStyle ? this.styleBulderService.getStyle(this.widgetItem.style.keyIconStyle) : {};
4328
4271
  this.valueIconClass = this.widgetItem.style.valueIconClass;
4329
- this.valueIconStyle = this.widgetItem.style.valueIconStyle ? this.styleBulderService.getItemStyle(parsedValueIconStyle) : {};
4272
+ this.valueIconStyle = this.widgetItem.style.valueIconStyle ? this.styleBulderService.getStyle(this.widgetItem.style.valueIconStyle) : {};
4330
4273
  this.hasSeparator = this.widgetItem.style.hasSeparator;
4331
4274
  this.isConfirmed = this.widgetItem.style.isConfirmed;
4332
4275
  }
@@ -4375,15 +4318,16 @@ class WidgetItemComponent {
4375
4318
  updatedItem.value = applicantId;
4376
4319
  break;
4377
4320
  }
4321
+ console.log(this.widget);
4378
4322
  this.widgetStore.setWidgetData(this.widget);
4379
4323
  this.widgetStore.setOnWidgetItemClick(updatedItem);
4380
4324
  }
4381
4325
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetItemComponent, deps: [{ token: StyleBuilderService }, { token: WidgetStore }, { token: WidgetQuery }], target: i0.ɵɵFactoryTarget.Component });
4382
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.4", type: WidgetItemComponent, isStandalone: false, selector: "lib-widget-item", inputs: { widgetItem: "widgetItem", widget: "widget", application: "application" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container\" [class.border-bottom]=\"hasSeparator\">\r\n <div class=\"widget-content\"\r\n [ngClass]=\"{\r\n 'layout-row': widget.layoutType === 'row',\r\n 'layout-tile m-0': widget.layoutType === 'tile'\r\n }\">\r\n <div class=\"flex align-items-center justify-content-between w-full\">\r\n <div class=\"w-full\">\r\n <i *ngIf=\"keyIconClass\" classs=\"keyIconClass\" [ngStyle]=\"keyIconStyle\"></i>\r\n <p *ngIf=\"!isMenu\" [ngStyle]=\"fieldKeyStyle\" class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetItem?.key }}</p>\r\n <p *ngIf=\"isMenu\" [ngStyle]=\"fieldKeyStyle\" (click)=\"handleDynamicEvent(widget.recordId)\"\r\n class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetItem?.key }}</p>\r\n </div>\r\n <div *ngIf=\"isConfirmed\">\r\n <i class=\"pi pi-check check-icon-wrapper\"></i>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-full\"\r\n [ngClass]=\"{'flex align-items-center justify-content-end': widget.layoutType === 'row'}\">\r\n <i *ngIf=\"valueIconClass\" classs=\"valueIconClass\" [ngStyle]=\"valueIconStyle\"></i>\r\n <p class=\"key-field-wrapper\">\r\n <ng-container *ngIf=\"widgetItem.isEvent; else notEvent\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleDynamicEvent(widget.recordId)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-template #notEvent>\r\n <ng-container *ngIf=\"widgetItem.isLink; else plainText\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleWidgetItemClick(widgetItem)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template #plainText>\r\n <span [ngStyle]=\"fieldValueStyle\">\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </span>\r\n </ng-template>\r\n </p>\r\n </div>\r\n </div>\r\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#4b5563}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}.border-bottom{border-bottom:1px solid rgba(76,98,146,.1)}.check-icon-wrapper{border-radius:50%;background:#22c55e;padding:8px}.widget-content.layout-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}.widget-content.layout-tile{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;row-gap:.5rem;align-items:start;margin:0}\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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
4326
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.4", type: WidgetItemComponent, isStandalone: false, selector: "lib-widget-item", inputs: { widgetItem: "widgetItem", widget: "widget", application: "application" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-container\" [class.border-bottom]=\"hasSeparator\">\r\n <div class=\"widget-content\"\r\n [ngClass]=\"{\r\n 'layout-row': widget.layoutType === 'row',\r\n 'layout-tile m-0': widget.layoutType === 'tile'\r\n }\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <div class=\"w-full\">\r\n <i *ngIf=\"keyIconClass\" classs=\"keyIconClass\" [ngStyle]=\"keyIconStyle\"></i>\r\n <p *ngIf=\"!isMenu\" [ngStyle]=\"fieldKeyStyle\" class=\"mb-0 text-color-secondary mr-3 key-field-wrapper w-50\">{{ widgetItem?.key }}</p>\r\n <p *ngIf=\"isMenu\" [ngStyle]=\"fieldKeyStyle\" (click)=\"handleDynamicEvent(widget.recordId)\"\r\n class=\"mb-0 text-color-secondary mr-3 key-field-wrapper w-50\">{{ widgetItem?.key }}</p>\r\n </div>\r\n <div *ngIf=\"isConfirmed\">\r\n <i class=\"pi pi-check check-icon-wrapper\"></i>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-50\"\r\n [ngClass]=\"{\r\n 'flex align-items-center justify-content-end': widget.layoutType === 'row'\r\n }\">\r\n <i *ngIf=\"valueIconClass\" classs=\"valueIconClass\" [ngStyle]=\"valueIconStyle\"></i>\r\n <p class=\"key-field-wrapper\">\r\n <ng-container *ngIf=\"widgetItem.isEvent; else notEvent\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleDynamicEvent(widget.recordId)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-template #notEvent>\r\n <ng-container *ngIf=\"widgetItem.isLink; else plainText\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleWidgetItemClick(widgetItem)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template #plainText>\r\n <span [ngStyle]=\"fieldValueStyle\">\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </span>\r\n </ng-template>\r\n </p>\r\n </div>\r\n </div>\r\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}.border-bottom{border-bottom:1px solid rgba(76,98,146,.1)}.check-icon-wrapper{border-radius:50%;background:#22c55e;padding:8px}.widget-content.layout-row{display:flex;flex-direction:row;align-items:center;gap:.5rem}.widget-content.layout-tile{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;row-gap:.5rem;align-items:start;margin:0}\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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
4383
4327
  }
4384
4328
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetItemComponent, decorators: [{
4385
4329
  type: Component,
4386
- args: [{ selector: 'lib-widget-item', standalone: false, template: "<div class=\"widget-container\" [class.border-bottom]=\"hasSeparator\">\r\n <div class=\"widget-content\"\r\n [ngClass]=\"{\r\n 'layout-row': widget.layoutType === 'row',\r\n 'layout-tile m-0': widget.layoutType === 'tile'\r\n }\">\r\n <div class=\"flex align-items-center justify-content-between w-full\">\r\n <div class=\"w-full\">\r\n <i *ngIf=\"keyIconClass\" classs=\"keyIconClass\" [ngStyle]=\"keyIconStyle\"></i>\r\n <p *ngIf=\"!isMenu\" [ngStyle]=\"fieldKeyStyle\" class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetItem?.key }}</p>\r\n <p *ngIf=\"isMenu\" [ngStyle]=\"fieldKeyStyle\" (click)=\"handleDynamicEvent(widget.recordId)\"\r\n class=\"mb-0 mr-3 key-field-wrapper\">{{ widgetItem?.key }}</p>\r\n </div>\r\n <div *ngIf=\"isConfirmed\">\r\n <i class=\"pi pi-check check-icon-wrapper\"></i>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-full\"\r\n [ngClass]=\"{'flex align-items-center justify-content-end': widget.layoutType === 'row'}\">\r\n <i *ngIf=\"valueIconClass\" classs=\"valueIconClass\" [ngStyle]=\"valueIconStyle\"></i>\r\n <p class=\"key-field-wrapper\">\r\n <ng-container *ngIf=\"widgetItem.isEvent; else notEvent\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleDynamicEvent(widget.recordId)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-template #notEvent>\r\n <ng-container *ngIf=\"widgetItem.isLink; else plainText\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleWidgetItemClick(widgetItem)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template #plainText>\r\n <span [ngStyle]=\"fieldValueStyle\">\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </span>\r\n </ng-template>\r\n </p>\r\n </div>\r\n </div>\r\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#4b5563}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}.border-bottom{border-bottom:1px solid rgba(76,98,146,.1)}.check-icon-wrapper{border-radius:50%;background:#22c55e;padding:8px}.widget-content.layout-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}.widget-content.layout-tile{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;row-gap:.5rem;align-items:start;margin:0}\n"] }]
4330
+ args: [{ selector: 'lib-widget-item', standalone: false, template: "<div class=\"widget-container\" [class.border-bottom]=\"hasSeparator\">\r\n <div class=\"widget-content\"\r\n [ngClass]=\"{\r\n 'layout-row': widget.layoutType === 'row',\r\n 'layout-tile m-0': widget.layoutType === 'tile'\r\n }\">\r\n <div class=\"flex align-items-center justify-content-between\">\r\n <div class=\"w-full\">\r\n <i *ngIf=\"keyIconClass\" classs=\"keyIconClass\" [ngStyle]=\"keyIconStyle\"></i>\r\n <p *ngIf=\"!isMenu\" [ngStyle]=\"fieldKeyStyle\" class=\"mb-0 text-color-secondary mr-3 key-field-wrapper w-50\">{{ widgetItem?.key }}</p>\r\n <p *ngIf=\"isMenu\" [ngStyle]=\"fieldKeyStyle\" (click)=\"handleDynamicEvent(widget.recordId)\"\r\n class=\"mb-0 text-color-secondary mr-3 key-field-wrapper w-50\">{{ widgetItem?.key }}</p>\r\n </div>\r\n <div *ngIf=\"isConfirmed\">\r\n <i class=\"pi pi-check check-icon-wrapper\"></i>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mb-0 text-color font-semibold text-value-wrapper w-50\"\r\n [ngClass]=\"{\r\n 'flex align-items-center justify-content-end': widget.layoutType === 'row'\r\n }\">\r\n <i *ngIf=\"valueIconClass\" classs=\"valueIconClass\" [ngStyle]=\"valueIconStyle\"></i>\r\n <p class=\"key-field-wrapper\">\r\n <ng-container *ngIf=\"widgetItem.isEvent; else notEvent\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleDynamicEvent(widget.recordId)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n\r\n <ng-template #notEvent>\r\n <ng-container *ngIf=\"widgetItem.isLink; else plainText\">\r\n <a\r\n class=\"cursor-pointer\"\r\n [ngStyle]=\"fieldValueStyle\"\r\n (click)=\"handleWidgetItemClick(widgetItem)\"\r\n >\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </a>\r\n </ng-container>\r\n </ng-template>\r\n\r\n <ng-template #plainText>\r\n <span [ngStyle]=\"fieldValueStyle\">\r\n {{ widgetItem.value !== 'null' ? widgetItem.value : '' }}\r\n </span>\r\n </ng-template>\r\n </p>\r\n </div>\r\n </div>\r\n</div>", styles: [".text-value-wrapper{-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-width:100%}.key-field-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.w-50{width:50%!important}.map-icon-wrapper{font-size:16px;padding:13px;border-radius:30px;border:1px solid rgba(76,98,146,.1);background:#4c62920a}.address-title-wrapper{width:80%;word-break:break-word;margin-top:-12px}.border-bottom{border-bottom:1px solid rgba(76,98,146,.1)}.check-icon-wrapper{border-radius:50%;background:#22c55e;padding:8px}.widget-content.layout-row{display:flex;flex-direction:row;align-items:center;gap:.5rem}.widget-content.layout-tile{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;row-gap:.5rem;align-items:start;margin:0}\n"] }]
4387
4331
  }], ctorParameters: () => [{ type: StyleBuilderService }, { type: WidgetStore }, { type: WidgetQuery }], propDecorators: { widgetItem: [{
4388
4332
  type: Input
4389
4333
  }], widget: [{
@@ -4393,49 +4337,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
4393
4337
  }] } });
4394
4338
 
4395
4339
  class WidgetBodyComponent {
4396
- styleBulderService;
4397
- constructor(styleBulderService) {
4398
- this.styleBulderService = styleBulderService;
4399
- }
4400
4340
  widget;
4401
- hasBackgroundColor = false;
4402
- widgetStyle = {};
4403
4341
  ngOnChanges(changes) {
4404
- if (this.widget && this.widget.style) {
4405
- const parsedWidgetStyle = this.styleBulderService.parseStyleObject(this.widget.style.widgetStyle);
4406
- this.hasBackgroundColor = !!parsedWidgetStyle?.['backgroundColor'];
4407
- this.widgetStyle = this.styleBulderService.getItemStyle(parsedWidgetStyle);
4408
- }
4409
- // this.computeStylesForAll();
4410
- }
4411
- // parseStyleObject(styleStr?: string): { [key: string]: any } {
4412
- // if (!styleStr) return {};
4413
- // try {
4414
- // return JSON.parse(styleStr);
4415
- // } catch (e) {
4416
- // return {};
4417
- // }
4418
- // }
4342
+ this.computeStylesForAll();
4343
+ }
4419
4344
  computeStylesForAll() {
4420
4345
  if (!this.widget?.dataItems)
4421
4346
  return;
4422
- // this.widget.dataItems.forEach((item: WidgetItem) => {
4423
- // const base = this.styleBulderService.parseStyleObject(
4424
- // typeof item.style.itemStyle === 'string' ? item.style.itemStyle : undefined
4425
- // );
4426
- // const expr = this.styleBulderService.parseStyleObject(
4427
- // typeof item.style.styleExpression === 'string' ? item.style.styleExpression : undefined
4428
- // );
4429
- // item.style.computedStyle = { ...base, ...expr };
4430
- // });
4431
- }
4432
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetBodyComponent, deps: [{ token: StyleBuilderService }], target: i0.ɵɵFactoryTarget.Component });
4433
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: WidgetBodyComponent, isStandalone: false, selector: "lib-widget-body", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-body-container grid m-0\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\" [ngClass]=\"widget.style.width\">\r\n @if(!dataItem.isHidden){\r\n <div [ngStyle]=\"widgetStyle\" [ngClass]=\"{'widget-item-wrapper': (i !== ((widget.dataItems || []).length - 1)) && dataItem.style?.hasSeparator}\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) || hasBackgroundColor ? 'widget-wrapper' : 'widget-last-wrapper')\r\n \" class=\"px-3\">\r\n <lib-widget-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.widget-last-wrapper{padding:10px 0 0}.vulnerability-title-wrapper{background:#fb392d36}\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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WidgetItemComponent, selector: "lib-widget-item", inputs: ["widgetItem", "widget", "application"] }] });
4347
+ this.widget.dataItems.forEach((item) => {
4348
+ console.log(item.style);
4349
+ const base = item.style?.itemStyle || {};
4350
+ console.log(base);
4351
+ const expr = item.style?.styleExpression || {};
4352
+ console.log(expr);
4353
+ item.style.computedStyle = { ...base, ...expr };
4354
+ });
4355
+ }
4356
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4357
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: WidgetBodyComponent, isStandalone: false, selector: "lib-widget-body", inputs: { widget: "widget" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"widget-body-container grid m-0\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\" [ngClass]=\"widget.style.width\">\r\n @if(!dataItem.isHidden){\r\n <div [ngStyle]=\"dataItem.style.computedStyle\" [ngClass]=\"(i !== ((widget.dataItems || []).length - 1)) && dataItem.style.hasSeparator ? 'widget-item-wrapper' : ''\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\r\n \" class=\"px-3\">\r\n <lib-widget-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.widget-last-wrapper{padding:10px 0 0}.vulnerability-title-wrapper{background:#fb392d36}\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.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WidgetItemComponent, selector: "lib-widget-item", inputs: ["widgetItem", "widget", "application"] }] });
4434
4358
  }
4435
4359
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetBodyComponent, decorators: [{
4436
4360
  type: Component,
4437
- args: [{ selector: 'lib-widget-body', standalone: false, template: "<div class=\"widget-body-container grid m-0\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\" [ngClass]=\"widget.style.width\">\r\n @if(!dataItem.isHidden){\r\n <div [ngStyle]=\"widgetStyle\" [ngClass]=\"{'widget-item-wrapper': (i !== ((widget.dataItems || []).length - 1)) && dataItem.style?.hasSeparator}\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) || hasBackgroundColor ? 'widget-wrapper' : 'widget-last-wrapper')\r\n \" class=\"px-3\">\r\n <lib-widget-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.widget-last-wrapper{padding:10px 0 0}.vulnerability-title-wrapper{background:#fb392d36}\n"] }]
4438
- }], ctorParameters: () => [{ type: StyleBuilderService }], propDecorators: { widget: [{
4361
+ args: [{ selector: 'lib-widget-body', standalone: false, template: "<div class=\"widget-body-container grid m-0\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\" [ngClass]=\"widget.style.width\">\r\n @if(!dataItem.isHidden){\r\n <div [ngStyle]=\"dataItem.style.computedStyle\" [ngClass]=\"(i !== ((widget.dataItems || []).length - 1)) && dataItem.style.hasSeparator ? 'widget-item-wrapper' : ''\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\r\n \" class=\"px-3\">\r\n <lib-widget-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.widget-last-wrapper{padding:10px 0 0}.vulnerability-title-wrapper{background:#fb392d36}\n"] }]
4362
+ }], propDecorators: { widget: [{
4439
4363
  type: Input
4440
4364
  }] } });
4441
4365
 
@@ -4837,11 +4761,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImpor
4837
4761
  class WidgetMenuBodyComponent {
4838
4762
  widget;
4839
4763
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetMenuBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
4840
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: WidgetMenuBodyComponent, isStandalone: false, selector: "lib-widget-menu-body", inputs: { widget: "widget" }, ngImport: i0, template: "<div class=\"widget-body-container\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\">\r\n @if(!dataItem.isHidden){\r\n <div [ngClass]=\"i !== ((widget.dataItems || []).length - 1) ? 'widget-item-wrapper' : ''\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\r\n \" class=\"px-3\">\r\n <lib-widget-menu-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-menu-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.vulnerability-title-wrapper{background:#fb392d36}\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: "component", type: WidgetMenuItemComponent, selector: "lib-widget-menu-item", inputs: ["widgetItem", "widget", "application"] }] });
4764
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: WidgetMenuBodyComponent, isStandalone: false, selector: "lib-widget-menu-body", inputs: { widget: "widget" }, ngImport: i0, template: "<div class=\"widget-body-container\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\">\r\n @if(!dataItem.isHidden){\r\n <div [ngClass]=\"i !== ((widget.dataItems || []).length - 1) ? 'widget-item-wrapper' : ''\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\r\n \" class=\"px-3\">\r\n <lib-widget-menu-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-menu-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.widget-last-wrapper{padding:10px 0 0}.vulnerability-title-wrapper{background:#fb392d36}\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: "component", type: WidgetMenuItemComponent, selector: "lib-widget-menu-item", inputs: ["widgetItem", "widget", "application"] }] });
4841
4765
  }
4842
4766
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: WidgetMenuBodyComponent, decorators: [{
4843
4767
  type: Component,
4844
- args: [{ selector: 'lib-widget-menu-body', standalone: false, template: "<div class=\"widget-body-container\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\">\r\n @if(!dataItem.isHidden){\r\n <div [ngClass]=\"i !== ((widget.dataItems || []).length - 1) ? 'widget-item-wrapper' : ''\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\r\n \" class=\"px-3\">\r\n <lib-widget-menu-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-menu-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.vulnerability-title-wrapper{background:#fb392d36}\n"] }]
4768
+ args: [{ selector: 'lib-widget-menu-body', standalone: false, template: "<div class=\"widget-body-container\">\r\n <div *ngFor=\"let dataItem of widget?.dataItems || []; let i = index\">\r\n @if(!dataItem.isHidden){\r\n <div [ngClass]=\"i !== ((widget.dataItems || []).length - 1) ? 'widget-item-wrapper' : ''\">\r\n <div [ngClass]=\"\r\n dataItem?.key === 'Vulnerability' && widget.predefinedName === 'ApplicantWidget'\r\n ? 'vulnerability-title-wrapper'\r\n : ( i !== ((widget.dataItems || []).length - 1) ? 'widget-wrapper' : 'widget-last-wrapper' )\r\n \" class=\"px-3\">\r\n <lib-widget-menu-item [widgetItem]=\"dataItem\" [widget]=\"widget\"></lib-widget-menu-item>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>", styles: [".widget-item-wrapper{border-bottom:1px solid rgba(68,72,109,.1)}.widget-wrapper{padding:10px 0}.widget-last-wrapper{padding:10px 0 0}.vulnerability-title-wrapper{background:#fb392d36}\n"] }]
4845
4769
  }], propDecorators: { widget: [{
4846
4770
  type: Input
4847
4771
  }] } });
@@ -4911,6 +4835,7 @@ class WidgetMenuContainerComponent {
4911
4835
  .pipe(takeUntil(this.destroy$))
4912
4836
  .subscribe((res) => {
4913
4837
  if (res) {
4838
+ console.log("widget=>", res);
4914
4839
  this.getWidgetData.emit(res);
4915
4840
  }
4916
4841
  }, (error) => {