@smartbit4all/ng-client 7.0.1 → 7.0.2

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.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { InjectionToken, reflectComponentType, Injectable, inject, DOCUMENT, PLATFORM_ID, Optional, Inject, RendererStyleFlags2, input, computed, Component, HostListener, HostBinding, Directive, ViewContainerRef, ElementRef, Renderer2, ChangeDetectorRef, Input, output, signal, Injector, ViewChild, ViewChildren, effect, afterNextRender, NgZone, forwardRef, Pipe, ChangeDetectionStrategy, ViewEncapsulation, ApplicationRef, EventEmitter, Output, makeEnvironmentProviders, importProvidersFrom } from '@angular/core';
2
+ import { InjectionToken, reflectComponentType, Injectable, inject, DOCUMENT, PLATFORM_ID, Optional, Inject, RendererStyleFlags2, input, computed, Component, HostListener, HostBinding, Directive, ViewContainerRef, ElementRef, Renderer2, ChangeDetectorRef, Input, output, signal, Injector, ViewChild, ViewChildren, effect, afterNextRender, NgZone, forwardRef, Pipe, ChangeDetectionStrategy, ViewEncapsulation, ApplicationRef, EventEmitter, Output, viewChild, makeEnvironmentProviders, importProvidersFrom } from '@angular/core';
3
3
  import * as i1 from '@angular/common/http';
4
4
  import { HttpHeaders, HttpContext, HttpErrorResponse, HttpParams, provideHttpClient, withInterceptors, withInterceptorsFromDi } from '@angular/common/http';
5
5
  import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
@@ -24,7 +24,7 @@ import { MatAutocompleteTrigger, MatAutocomplete } from '@angular/material/autoc
24
24
  import { MatChipGrid, MatChipRow, MatChipRemove, MatChipInput, MatChip } from '@angular/material/chips';
25
25
  import { deepEqual } from 'fast-equals';
26
26
  import { set } from 'date-fns';
27
- import { Overlay, OverlayPositionBuilder } from '@angular/cdk/overlay';
27
+ import { Overlay, OverlayPositionBuilder, ScrollDispatcher } from '@angular/cdk/overlay';
28
28
  import { TemplatePortal } from '@angular/cdk/portal';
29
29
  import { MatLabel, MatFormField, MatSuffix, MatHint, MatPrefix } from '@angular/material/form-field';
30
30
  import WaveSurfer from 'wavesurfer.js';
@@ -5288,7 +5288,7 @@ class UiActionService {
5288
5288
  }
5289
5289
  else if (uiAction.submit || uiAction.model) {
5290
5290
  if (options?.widgetId && options?.nodeId) {
5291
- uiActionRequest.params['clientPageModel'] = executor.getModel();
5291
+ uiActionRequest.params['clientPageModel'] = { data: executor.getModel() };
5292
5292
  }
5293
5293
  else {
5294
5294
  uiActionRequest.params['model'] = executor.getModel();
@@ -7474,6 +7474,7 @@ class HoverMenuComponent {
7474
7474
  this.overlay = inject(Overlay);
7475
7475
  this.viewContainerRef = inject(ViewContainerRef);
7476
7476
  this.overlayPositionBuilder = inject(OverlayPositionBuilder);
7477
+ this.scrollDispatcher = inject(ScrollDispatcher);
7477
7478
  /**
7478
7479
  * The open menu's overlay, and with it {@link isOpen}. A signal because the menu is also
7479
7480
  * closed from outside a template event — `UiMenuService`'s close signal — and the trigger
@@ -7495,6 +7496,10 @@ class HoverMenuComponent {
7495
7496
  this.submenuOpenMap = new Map();
7496
7497
  this.subActions = [];
7497
7498
  this.hasCheckedChildren = false;
7499
+ this.lastScrollContainer = null;
7500
+ this.onContainerScroll = () => {
7501
+ this.overlayRef?.updatePosition();
7502
+ };
7498
7503
  this.icon = 'chevron_right';
7499
7504
  }
7500
7505
  ngOnInit() {
@@ -7562,6 +7567,11 @@ class HoverMenuComponent {
7562
7567
  }
7563
7568
  closeMenu() {
7564
7569
  if (this.overlayRef) {
7570
+ const container = this.lastScrollContainer;
7571
+ if (container) {
7572
+ container.removeEventListener('scroll', this.onContainerScroll);
7573
+ this.lastScrollContainer = null;
7574
+ }
7565
7575
  this.overlayRef.dispose();
7566
7576
  this.overlayRef = null;
7567
7577
  this.hasCheckedChildren = false;
@@ -7598,19 +7608,42 @@ class HoverMenuComponent {
7598
7608
  var positions = isSubmenu
7599
7609
  ? getSubmenuPositions(this.menuOpenDirection())
7600
7610
  : getMenuPositions(triggerAction?.descriptor?.menu?.openDirection);
7611
+ const scrollContainer = this.getScrollContainer(triggerElement);
7601
7612
  let positionStrategy = this.overlayPositionBuilder
7602
7613
  .flexibleConnectedTo(triggerElement)
7603
7614
  .withFlexibleDimensions(false)
7604
7615
  .withPush(true)
7605
- .withPositions(positions);
7616
+ .withPositions(positions)
7617
+ .withScrollableContainers(this.scrollDispatcher.getAncestorScrollContainers(triggerElement));
7606
7618
  this.overlayRef = this.overlay.create({
7607
7619
  positionStrategy,
7608
7620
  scrollStrategy: this.overlay.scrollStrategies.reposition(),
7609
7621
  hasBackdrop: false,
7610
7622
  });
7623
+ if (scrollContainer) {
7624
+ this.lastScrollContainer = scrollContainer;
7625
+ scrollContainer.addEventListener('scroll', this.onContainerScroll, { passive: true });
7626
+ }
7611
7627
  let portal = new TemplatePortal(this.menuTemplate, this.viewContainerRef);
7612
7628
  this.overlayRef.attach(portal);
7613
7629
  }
7630
+ /**
7631
+ * The nearest scrolling ancestor of the trigger, if any. The CDK only knows about
7632
+ * `cdkScrollable` containers; a plain overflow container (a dialog body, a page section)
7633
+ * would otherwise scroll away under an open menu.
7634
+ */
7635
+ getScrollContainer(el) {
7636
+ let parent = el.parentElement;
7637
+ while (parent) {
7638
+ const style = window.getComputedStyle(parent);
7639
+ const overflow = style.overflow + style.overflowY;
7640
+ if (/auto|scroll/.test(overflow) && parent.scrollHeight > parent.clientHeight) {
7641
+ return parent;
7642
+ }
7643
+ parent = parent.parentElement;
7644
+ }
7645
+ return null;
7646
+ }
7614
7647
  toggleMenu(event) {
7615
7648
  if (!this.isOpen) {
7616
7649
  this.openMenu(event);
@@ -7714,6 +7747,7 @@ class ClickMenuComponent {
7714
7747
  this.overlay = inject(Overlay);
7715
7748
  this.viewContainerRef = inject(ViewContainerRef);
7716
7749
  this.overlayPositionBuilder = inject(OverlayPositionBuilder);
7750
+ this.scrollDispatcher = inject(ScrollDispatcher);
7717
7751
  /**
7718
7752
  * The open menu's overlay, and with it {@link isOpen}. A signal because the menu is also
7719
7753
  * closed from outside a template event — `UiMenuService`'s close signal — and the trigger
@@ -7733,6 +7767,10 @@ class ClickMenuComponent {
7733
7767
  this.submenuOpenMap = new Map();
7734
7768
  this.subActions = [];
7735
7769
  this.hasCheckedChildren = false;
7770
+ this.lastScrollContainer = null;
7771
+ this.onContainerScroll = () => {
7772
+ this.overlayRef?.updatePosition();
7773
+ };
7736
7774
  this.icon = 'chevron_right';
7737
7775
  }
7738
7776
  ngOnInit() {
@@ -7800,6 +7838,11 @@ class ClickMenuComponent {
7800
7838
  }
7801
7839
  closeMenu() {
7802
7840
  if (this.overlayRef) {
7841
+ const container = this.lastScrollContainer;
7842
+ if (container) {
7843
+ container.removeEventListener('scroll', this.onContainerScroll);
7844
+ this.lastScrollContainer = null;
7845
+ }
7803
7846
  this.overlayRef.dispose();
7804
7847
  this.overlayRef = null;
7805
7848
  this.hasCheckedChildren = false;
@@ -7835,19 +7878,42 @@ class ClickMenuComponent {
7835
7878
  var positions = isSubmenu
7836
7879
  ? getSubmenuPositions(this.menuOpenDirection())
7837
7880
  : getMenuPositions(triggerAction?.descriptor?.menu?.openDirection);
7881
+ const scrollContainer = this.getScrollContainer(triggerElement);
7838
7882
  let positionStrategy = this.overlayPositionBuilder
7839
7883
  .flexibleConnectedTo(triggerElement)
7840
7884
  .withFlexibleDimensions(false)
7841
7885
  .withPush(true)
7842
- .withPositions(positions);
7886
+ .withPositions(positions)
7887
+ .withScrollableContainers(this.scrollDispatcher.getAncestorScrollContainers(triggerElement));
7843
7888
  this.overlayRef = this.overlay.create({
7844
7889
  positionStrategy,
7845
7890
  scrollStrategy: this.overlay.scrollStrategies.reposition(),
7846
7891
  hasBackdrop: false,
7847
7892
  });
7893
+ if (scrollContainer) {
7894
+ this.lastScrollContainer = scrollContainer;
7895
+ scrollContainer.addEventListener('scroll', this.onContainerScroll, { passive: true });
7896
+ }
7848
7897
  let portal = new TemplatePortal(this.menuTemplate, this.viewContainerRef);
7849
7898
  this.overlayRef.attach(portal);
7850
7899
  }
7900
+ /**
7901
+ * The nearest scrolling ancestor of the trigger, if any. The CDK only knows about
7902
+ * `cdkScrollable` containers; a plain overflow container (a dialog body, a page section)
7903
+ * would otherwise scroll away under an open menu.
7904
+ */
7905
+ getScrollContainer(el) {
7906
+ let parent = el.parentElement;
7907
+ while (parent) {
7908
+ const style = window.getComputedStyle(parent);
7909
+ const overflow = style.overflow + style.overflowY;
7910
+ if (/auto|scroll/.test(overflow) && parent.scrollHeight > parent.clientHeight) {
7911
+ return parent;
7912
+ }
7913
+ parent = parent.parentElement;
7914
+ }
7915
+ return null;
7916
+ }
7851
7917
  toggleMenu(event) {
7852
7918
  if (!this.isOpen) {
7853
7919
  this.openMenu(event);
@@ -8558,11 +8624,11 @@ class SmartfileuploaderComponent {
8558
8624
  };
8559
8625
  }
8560
8626
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SmartfileuploaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8561
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SmartfileuploaderComponent, isStandalone: true, selector: "smartfileuploader", inputs: { uploadCallback: { classPropertyName: "uploadCallback", publicName: "uploadCallback", isSignal: true, isRequired: true, transformFunction: null }, fileFormats: { classPropertyName: "fileFormats", publicName: "fileFormats", isSignal: true, isRequired: false, transformFunction: null }, maxSizeMb: { classPropertyName: "maxSizeMb", publicName: "maxSizeMb", isSignal: true, isRequired: false, transformFunction: null }, i18n: { classPropertyName: "i18n", publicName: "i18n", isSignal: false, isRequired: false, transformFunction: null }, useIconButton: { classPropertyName: "useIconButton", publicName: "useIconButton", isSignal: true, isRequired: false, transformFunction: null }, isMultiple: { classPropertyName: "isMultiple", publicName: "isMultiple", isSignal: true, isRequired: false, transformFunction: null }, autoUpload: { classPropertyName: "autoUpload", publicName: "autoUpload", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div\n class=\"container\"\n [ngClass]=\"{ disabledWidget: isDisabled() }\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\"\n [class.dragover]=\"isDragOver\"\n >\n <div class=\"fileContainer\" (click)=\"fileInput.click()\">\n <input\n #fileInput\n id=\"addFile\"\n placeholder=\"fileInput\"\n type=\"file\"\n (change)=\"getFile($event)\"\n class=\"file\"\n accept=\"{{ fileFormats()?.join(', ') }}\"\n [size]=\"maxSizeMb()\"\n [multiple]=\"isMultiple()\"\n [disabled]=\"isDisabled()\"\n style=\"display: none\"\n />\n <div class=\"fileUploadContentContainer\">\n <div class=\"icon\">\n @if (useIconButton()) {\n <mat-label class=\"addFileButton\">\n <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\n </mat-label>\n }\n @if (!useIconButton()) {\n <button mat-raised-button color=\"primary\" class=\"addFileButton\">\n {{ i18n!.addFile }}\n </button>\n }\n </div>\n <div class=\"labels\">\n @if (useIconButton()) {\n <mat-label class=\"label primary title\">\n {{ i18n!.addFile }}\n </mat-label>\n }\n <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\n </div>\n @if (files.length) {\n <div class=\"uploadButton\">\n <ui-action-button (actionClick)=\"uploadFile()\" [descriptor]=\"uploadButton\">\n </ui-action-button>\n </div>\n }\n </div>\n </div>\n\n @if (errors.length) {\n <div class=\"errorMessage\">\n <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\n <div class=\"errors\">\n @for (error of errors; track error) {\n <span>{{ error }}</span>\n }\n </div>\n </div>\n }\n\n @if (files.length) {\n <div class=\"uploadedFilesContainer\">\n @for (file of files; track file; let i = $index) {\n <div class=\"uploadedFile\">\n @if (filePreviewUrl(file)) {\n <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\n } @else {\n <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\n }\n <div class=\"fileData\">\n <div class=\"fileDataContainer\">\n <span class=\"fileName\">{{ file.name }}</span>\n <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\n </div>\n </div>\n <div class=\"fileActions\">\n <smart-icon class=\"downloadIcon\" icon=\"download\" (click)=\"downloadFile(file)\"></smart-icon>\n <smart-icon class=\"removeIcon\" icon=\"delete\" (click)=\"remove(i)\"></smart-icon>\n </div>\n </div>\n }\n </div>\n }\n</div>\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }] }); }
8627
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SmartfileuploaderComponent, isStandalone: true, selector: "smartfileuploader", inputs: { uploadCallback: { classPropertyName: "uploadCallback", publicName: "uploadCallback", isSignal: true, isRequired: true, transformFunction: null }, fileFormats: { classPropertyName: "fileFormats", publicName: "fileFormats", isSignal: true, isRequired: false, transformFunction: null }, maxSizeMb: { classPropertyName: "maxSizeMb", publicName: "maxSizeMb", isSignal: true, isRequired: false, transformFunction: null }, i18n: { classPropertyName: "i18n", publicName: "i18n", isSignal: false, isRequired: false, transformFunction: null }, useIconButton: { classPropertyName: "useIconButton", publicName: "useIconButton", isSignal: true, isRequired: false, transformFunction: null }, isMultiple: { classPropertyName: "isMultiple", publicName: "isMultiple", isSignal: true, isRequired: false, transformFunction: null }, autoUpload: { classPropertyName: "autoUpload", publicName: "autoUpload", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div\n class=\"container\"\n [ngClass]=\"{ disabledWidget: isDisabled() }\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\"\n [class.dragover]=\"isDragOver\"\n >\n <div class=\"fileContainer\" (click)=\"fileInput.click()\">\n <input\n #fileInput\n id=\"addFile\"\n placeholder=\"fileInput\"\n type=\"file\"\n (change)=\"getFile($event)\"\n class=\"file\"\n accept=\"{{ fileFormats()?.join(', ') }}\"\n [size]=\"maxSizeMb()\"\n [multiple]=\"isMultiple()\"\n [disabled]=\"isDisabled()\"\n style=\"display: none\"\n />\n <div class=\"fileUploadContentContainer\">\n <div class=\"icon\">\n @if (useIconButton()) {\n <mat-label class=\"addFileButton\">\n <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\n </mat-label>\n }\n @if (!useIconButton()) {\n <button mat-raised-button color=\"primary\" class=\"addFileButton\">\n {{ i18n!.addFile }}\n </button>\n }\n </div>\n <div class=\"labels\">\n @if (useIconButton()) {\n <mat-label class=\"label primary title\">\n {{ i18n!.addFile }}\n </mat-label>\n }\n <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\n </div>\n @if (files.length) {\n <div class=\"uploadButton\">\n <ui-action-button\n (actionClick)=\"uploadFile()\"\n [code]=\"'default-upload'\"\n [descriptor]=\"uploadButton\"\n >\n </ui-action-button>\n </div>\n }\n </div>\n </div>\n\n @if (errors.length) {\n <div class=\"errorMessage\">\n <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\n <div class=\"errors\">\n @for (error of errors; track error) {\n <span>{{ error }}</span>\n }\n </div>\n </div>\n }\n\n @if (files.length) {\n <div class=\"uploadedFilesContainer\">\n @for (file of files; track file; let i = $index) {\n <div class=\"uploadedFile\">\n @if (filePreviewUrl(file)) {\n <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\n } @else {\n <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\n }\n <div class=\"fileData\">\n <div class=\"fileDataContainer\">\n <span class=\"fileName\">{{ file.name }}</span>\n <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\n </div>\n </div>\n <div class=\"fileActions\">\n <smart-icon\n class=\"downloadIcon\"\n icon=\"download\"\n (click)=\"downloadFile(file)\"\n [attr.data-testid]=\"'default_download'\"\n ></smart-icon>\n <smart-icon\n class=\"removeIcon\"\n icon=\"delete\"\n [attr.data-testid]=\"'default_remove'\"\n (click)=\"remove(i)\"\n ></smart-icon>\n </div>\n </div>\n }\n </div>\n }\n</div>\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }] }); }
8562
8628
  }
8563
8629
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SmartfileuploaderComponent, decorators: [{
8564
8630
  type: Component,
8565
- args: [{ selector: 'smartfileuploader', imports: [NgClass, MatLabel, MatIcon, MatButton, UiActionButtonComponent, SmartIconComponent], template: "<div\n class=\"container\"\n [ngClass]=\"{ disabledWidget: isDisabled() }\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\"\n [class.dragover]=\"isDragOver\"\n >\n <div class=\"fileContainer\" (click)=\"fileInput.click()\">\n <input\n #fileInput\n id=\"addFile\"\n placeholder=\"fileInput\"\n type=\"file\"\n (change)=\"getFile($event)\"\n class=\"file\"\n accept=\"{{ fileFormats()?.join(', ') }}\"\n [size]=\"maxSizeMb()\"\n [multiple]=\"isMultiple()\"\n [disabled]=\"isDisabled()\"\n style=\"display: none\"\n />\n <div class=\"fileUploadContentContainer\">\n <div class=\"icon\">\n @if (useIconButton()) {\n <mat-label class=\"addFileButton\">\n <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\n </mat-label>\n }\n @if (!useIconButton()) {\n <button mat-raised-button color=\"primary\" class=\"addFileButton\">\n {{ i18n!.addFile }}\n </button>\n }\n </div>\n <div class=\"labels\">\n @if (useIconButton()) {\n <mat-label class=\"label primary title\">\n {{ i18n!.addFile }}\n </mat-label>\n }\n <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\n </div>\n @if (files.length) {\n <div class=\"uploadButton\">\n <ui-action-button (actionClick)=\"uploadFile()\" [descriptor]=\"uploadButton\">\n </ui-action-button>\n </div>\n }\n </div>\n </div>\n\n @if (errors.length) {\n <div class=\"errorMessage\">\n <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\n <div class=\"errors\">\n @for (error of errors; track error) {\n <span>{{ error }}</span>\n }\n </div>\n </div>\n }\n\n @if (files.length) {\n <div class=\"uploadedFilesContainer\">\n @for (file of files; track file; let i = $index) {\n <div class=\"uploadedFile\">\n @if (filePreviewUrl(file)) {\n <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\n } @else {\n <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\n }\n <div class=\"fileData\">\n <div class=\"fileDataContainer\">\n <span class=\"fileName\">{{ file.name }}</span>\n <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\n </div>\n </div>\n <div class=\"fileActions\">\n <smart-icon class=\"downloadIcon\" icon=\"download\" (click)=\"downloadFile(file)\"></smart-icon>\n <smart-icon class=\"removeIcon\" icon=\"delete\" (click)=\"remove(i)\"></smart-icon>\n </div>\n </div>\n }\n </div>\n }\n</div>\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"] }]
8631
+ args: [{ selector: 'smartfileuploader', imports: [NgClass, MatLabel, MatIcon, MatButton, UiActionButtonComponent, SmartIconComponent], template: "<div\n class=\"container\"\n [ngClass]=\"{ disabledWidget: isDisabled() }\"\n (dragover)=\"onDragOver($event)\"\n (dragleave)=\"onDragLeave($event)\"\n (drop)=\"onDrop($event)\"\n [class.dragover]=\"isDragOver\"\n >\n <div class=\"fileContainer\" (click)=\"fileInput.click()\">\n <input\n #fileInput\n id=\"addFile\"\n placeholder=\"fileInput\"\n type=\"file\"\n (change)=\"getFile($event)\"\n class=\"file\"\n accept=\"{{ fileFormats()?.join(', ') }}\"\n [size]=\"maxSizeMb()\"\n [multiple]=\"isMultiple()\"\n [disabled]=\"isDisabled()\"\n style=\"display: none\"\n />\n <div class=\"fileUploadContentContainer\">\n <div class=\"icon\">\n @if (useIconButton()) {\n <mat-label class=\"addFileButton\">\n <mat-icon color=\"primary\" class=\"addCircle\">add_circle</mat-icon>\n </mat-label>\n }\n @if (!useIconButton()) {\n <button mat-raised-button color=\"primary\" class=\"addFileButton\">\n {{ i18n!.addFile }}\n </button>\n }\n </div>\n <div class=\"labels\">\n @if (useIconButton()) {\n <mat-label class=\"label primary title\">\n {{ i18n!.addFile }}\n </mat-label>\n }\n <mat-label class=\"label secondary\"> {{ i18n!.browseOrDrag }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.maxSize }} </mat-label>\n <mat-label class=\"subLabel primary\"> {{ i18n!.formats }} </mat-label>\n </div>\n @if (files.length) {\n <div class=\"uploadButton\">\n <ui-action-button\n (actionClick)=\"uploadFile()\"\n [code]=\"'default-upload'\"\n [descriptor]=\"uploadButton\"\n >\n </ui-action-button>\n </div>\n }\n </div>\n </div>\n\n @if (errors.length) {\n <div class=\"errorMessage\">\n <smart-icon [icon]=\"'error'\" [color]=\"'warn'\"></smart-icon>\n <div class=\"errors\">\n @for (error of errors; track error) {\n <span>{{ error }}</span>\n }\n </div>\n </div>\n }\n\n @if (files.length) {\n <div class=\"uploadedFilesContainer\">\n @for (file of files; track file; let i = $index) {\n <div class=\"uploadedFile\">\n @if (filePreviewUrl(file)) {\n <img [src]=\"filePreviewUrl(file)\" [alt]=\"file.name\" width=\"50\" height=\"50\" />\n } @else {\n <smart-icon [icon]=\"'insert_drive_file'\"></smart-icon>\n }\n <div class=\"fileData\">\n <div class=\"fileDataContainer\">\n <span class=\"fileName\">{{ file.name }}</span>\n <span class=\"fileSize\">{{ formatSize(file.size) }}</span>\n </div>\n </div>\n <div class=\"fileActions\">\n <smart-icon\n class=\"downloadIcon\"\n icon=\"download\"\n (click)=\"downloadFile(file)\"\n [attr.data-testid]=\"'default_download'\"\n ></smart-icon>\n <smart-icon\n class=\"removeIcon\"\n icon=\"delete\"\n [attr.data-testid]=\"'default_remove'\"\n (click)=\"remove(i)\"\n ></smart-icon>\n </div>\n </div>\n }\n </div>\n }\n</div>\n", styles: [":host{--border-color: #a6aabd60;--warninig-color: #be2d2e;--def-border-radius: .5rem}.container{display:flex;flex-direction:column;border:2px dashed var(--border-color);border-radius:var(--def-border-radius)}.fileContainer{cursor:pointer;padding:1rem;display:flex;flex-direction:column}.fileContainer:hover{background-color:rgb(from var(--border-color) r g b / .1)}.disabledWidget ::ng-deep .fileContainer:hover{background-color:unset;cursor:unset}.disabledWidget ::ng-deep *{opacity:.85}.dragover{background-color:rgb(from var(--border-color) r g b / .1)}.fileUploadContentContainer{display:flex;flex-direction:row;gap:1rem}.icon mat-icon{font-size:3rem;width:unset;height:unset}.icon{align-content:center}.labels{flex:1;display:flex;flex-direction:column;justify-content:center;width:fit-content}.uploadButton{align-content:center}.primary{color:var(--primary-color)}.secondary{color:var(--gray)}.label{margin:unset}.subLabel{font-size:smaller}.title{padding-bottom:.3rem}.errorMessage,.uploadedFilesContainer{border-top:2px solid var(--border-color)}.errorMessage{display:flex;flex-direction:row;align-items:center;color:var(--warninig-color);padding:.5rem 1rem;gap:1rem}.errorMessage ::ng-deep mat-icon{color:var(--warninig-color)}.errors{display:flex;flex-direction:column}.uploadedFile{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;padding:1rem;border-bottom:1px solid #e0e0e0;gap:1rem}.uploadedFile:last-child{border-bottom:none}.fileSize{display:flex;flex-direction:row;font-size:smaller}.fileData{flex:1;display:flex;flex-direction:column}.fileDataContainer{display:flex;flex-direction:column;justify-content:flex-end;width:fit-content}.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}smart-icon ::ng-deep mat-icon{font-size:3rem;width:unset;height:unset}.fileActions{display:flex;flex-direction:row;justify-content:flex-end;gap:.5rem}.removeIcon ::ng-deep i,.removeIcon ::ng-deep mat-icon{color:var(--warninig-color)}.removeIcon ::ng-deep mat-icon,.downloadIcon ::ng-deep mat-icon{font-size:2rem}.removeIcon:hover,.downloadIcon:hover{cursor:pointer}smart-icon{display:flex;align-items:center}\n"] }]
8566
8632
  }], propDecorators: { fileInput: [{
8567
8633
  type: ViewChild,
8568
8634
  args: ['fileInput']
@@ -21014,7 +21080,7 @@ class SmartComponentLayoutComponent {
21014
21080
  layoutDefinitions: this.smartComponentLayout?.form,
21015
21081
  });
21016
21082
  const gridRow = this.gridRow;
21017
- if (gridRow && !gridRow.valueSet) {
21083
+ if (gridRow && !gridRow.valueSets) {
21018
21084
  gridRow.valueSets = this.smartComponent?.model?.valueSets;
21019
21085
  }
21020
21086
  this.smartForm = {
@@ -21185,11 +21251,11 @@ class GenericPageComponent extends SmartComponent {
21185
21251
  return false;
21186
21252
  }
21187
21253
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: GenericPageComponent, deps: [{ token: i0.Injector }, { token: SMART_GENERIC_PAGE_NAME }, { token: SMART_GENERIC_COMPONENT_NAME }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
21188
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: GenericPageComponent, isStandalone: true, selector: "app-generic-page", usesInheritance: true, ngImport: i0, template: "<div class=\"generic-page-container\">\n @if (componentLayout) {\n <smart-component-layout\n class=\"generic-page-layout\"\n [smartComponentLayout]=\"componentLayout\"\n ></smart-component-layout>\n }\n <smart-ui-action-toolbar\n class=\"generic-page-toolbar\"\n [uiActionModels]=\"uiActionModels\"\n ></smart-ui-action-toolbar>\n</div>\n@if (showRouterOutlet()) {\n <div>\n <ng-container [smartEmbeddedSlot]=\"'router-outlet'\" [containerUuid]=\"uuid\"></ng-container>\n </div>\n}\n", styles: [".generic-page-container{display:flex;flex-direction:column;gap:1rem}:host{min-width:200px;width:40vw}\n"], dependencies: [{ kind: "component", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout", "parentLayoutComponent", "gridRow"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "executor", "widgetId", "nodeId", "actionParams", "scrollOnWrap", "toolbarPropertes"] }, { kind: "directive", type: SmartEmbeddedSlotDirective, selector: "[smartEmbeddedSlot]", inputs: ["smartEmbeddedSlot", "containerUuid"] }] }); }
21254
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: GenericPageComponent, isStandalone: true, selector: "app-generic-page", usesInheritance: true, ngImport: i0, template: "<div class=\"generic-page-container\">\n @if (componentLayout) {\n <smart-component-layout\n class=\"generic-page-layout\"\n [smartComponentLayout]=\"componentLayout\"\n ></smart-component-layout>\n }\n <smart-ui-action-toolbar\n class=\"generic-page-toolbar\"\n [uiActionModels]=\"uiActionModels\"\n ></smart-ui-action-toolbar>\n</div>\n@if (showRouterOutlet()) {\n <div>\n <ng-container [smartEmbeddedSlot]=\"'router-outlet'\" [containerUuid]=\"uuid\"></ng-container>\n </div>\n}\n", styles: [".generic-page-container{display:flex;flex-direction:column;gap:1rem}\n"], dependencies: [{ kind: "component", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout", "parentLayoutComponent", "gridRow"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "executor", "widgetId", "nodeId", "actionParams", "scrollOnWrap", "toolbarPropertes"] }, { kind: "directive", type: SmartEmbeddedSlotDirective, selector: "[smartEmbeddedSlot]", inputs: ["smartEmbeddedSlot", "containerUuid"] }] }); }
21189
21255
  }
21190
21256
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: GenericPageComponent, decorators: [{
21191
21257
  type: Component,
21192
- args: [{ selector: 'app-generic-page', imports: [SmartComponentLayoutComponent, UiActionToolbarComponent, SmartEmbeddedSlotDirective], template: "<div class=\"generic-page-container\">\n @if (componentLayout) {\n <smart-component-layout\n class=\"generic-page-layout\"\n [smartComponentLayout]=\"componentLayout\"\n ></smart-component-layout>\n }\n <smart-ui-action-toolbar\n class=\"generic-page-toolbar\"\n [uiActionModels]=\"uiActionModels\"\n ></smart-ui-action-toolbar>\n</div>\n@if (showRouterOutlet()) {\n <div>\n <ng-container [smartEmbeddedSlot]=\"'router-outlet'\" [containerUuid]=\"uuid\"></ng-container>\n </div>\n}\n", styles: [".generic-page-container{display:flex;flex-direction:column;gap:1rem}:host{min-width:200px;width:40vw}\n"] }]
21258
+ args: [{ selector: 'app-generic-page', imports: [SmartComponentLayoutComponent, UiActionToolbarComponent, SmartEmbeddedSlotDirective], template: "<div class=\"generic-page-container\">\n @if (componentLayout) {\n <smart-component-layout\n class=\"generic-page-layout\"\n [smartComponentLayout]=\"componentLayout\"\n ></smart-component-layout>\n }\n <smart-ui-action-toolbar\n class=\"generic-page-toolbar\"\n [uiActionModels]=\"uiActionModels\"\n ></smart-ui-action-toolbar>\n</div>\n@if (showRouterOutlet()) {\n <div>\n <ng-container [smartEmbeddedSlot]=\"'router-outlet'\" [containerUuid]=\"uuid\"></ng-container>\n </div>\n}\n", styles: [".generic-page-container{display:flex;flex-direction:column;gap:1rem}\n"] }]
21193
21259
  }], ctorParameters: () => [{ type: i0.Injector }, { type: undefined, decorators: [{
21194
21260
  type: Inject,
21195
21261
  args: [SMART_GENERIC_PAGE_NAME]
@@ -22313,6 +22379,13 @@ class SearchPageComponent extends SmartComponent {
22313
22379
  /** Written from `dataChanged`, so a signal. */
22314
22380
  this.layoutState = signal(undefined, /* @ts-ignore */
22315
22381
  ...(ngDevMode ? [{ debugName: "layoutState" }] : /* istanbul ignore next */ []));
22382
+ /**
22383
+ * The page's own layout, handed to the grid so that the row layouts of a card grid never
22384
+ * look like the root of an embedded-view tree (#28870). A signal query: the template binds
22385
+ * it, and the layout is only rendered once the model arrives.
22386
+ */
22387
+ this.layoutComponent = viewChild(SmartComponentLayoutComponent, /* @ts-ignore */
22388
+ ...(ngDevMode ? [{ debugName: "layoutComponent" }] : /* istanbul ignore next */ []));
22316
22389
  this.setupGrid();
22317
22390
  this.sendModelOnWidgetAction = true;
22318
22391
  // uuid is set in onUuidResolved — it is not known at construction for
@@ -22352,17 +22425,19 @@ class SearchPageComponent extends SmartComponent {
22352
22425
  options: {
22353
22426
  rowUiActionType: GridUiActionType.POPUP_MENU,
22354
22427
  },
22428
+ // Card grids render the row's own layout with this class (see SmartGridCardComponent).
22429
+ layoutComponent: SmartComponentLayoutComponent,
22355
22430
  };
22356
22431
  }
22357
22432
  isShowNoResultText() {
22358
22433
  return this.data?.noResultText !== undefined && this.data?.noResultText !== null;
22359
22434
  }
22360
22435
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SearchPageComponent, deps: [{ token: i0.Injector }, { token: SmartFilterEditorService }, { token: SMART_SEARCH_PAGE_NAME }, { token: SMART_SEARCH_COMPONENT_NAME }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
22361
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SearchPageComponent, isStandalone: true, selector: "search-page", providers: [SmartFilterEditorService], viewQueries: [{ propertyName: "grid", first: true, predicate: ["grid"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"searchPageContainer\" [ngClass]=\"$safeNavigationMigration(data?.cssClassOfPage)\">\n <h1 class=\"search-page-title\"> {{ data?.pageTitle }} </h1>\n <!-- <div class=\"filterContainer\">\n <smart-filter [filter]=\"filter\"></smart-filter>\n</div> -->\n<smart-ui-action-toolbar [uiActionModels]=\"uiActionModels\"></smart-ui-action-toolbar>\n@if (filterService.model) {\n <div class=\"filter-editor-container\">\n <smart-filter-group-params [service]=\"filterService\"></smart-filter-group-params>\n <smart-filter-expression-editor [service]=\"filterService\"></smart-filter-expression-editor>\n </div>\n}\n@if (layout) {\n <smart-component-layout\n [smartComponentLayout]=\"layout\"\n ></smart-component-layout>\n}\n<div class=\"gridContainer\">\n @if (isShowNoResultText()) {\n <h2 class=\"noResultText\">\n {{ data?.noResultText }}\n </h2>\n }\n @if (!isShowNoResultText()) {\n <smart-grid\n #grid\n [smartGrid]=\"smartGrid\"\n [uuid]=\"uuid!\"\n ></smart-grid>\n }\n</div>\n</div>\n", styles: [".searchPageContainer{display:flex;flex-direction:column;gap:1.5rem}.filterContainer{display:flex;flex-direction:row;gap:1rem}.gridContainer{flex-grow:1}.filter-editor-container{display:flex;flex-direction:row}.noResultText{width:100%;text-align:center;padding-top:2rem;padding-bottom:2rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "executor", "widgetId", "nodeId", "actionParams", "scrollOnWrap", "toolbarPropertes"] }, { kind: "component", type: SmartFilterParamsComponent, selector: "smart-filter-group-params", inputs: ["service"] }, { kind: "component", type: SmartFilterEditorContentComponent, selector: "smart-filter-expression-editor", inputs: ["service"] }, { kind: "component", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout", "parentLayoutComponent", "gridRow"] }, { kind: "component", type: SmartGridComponent, selector: "smart-grid", inputs: ["smartGrid", "uuid", "parentLayoutComponent", "dev"] }] }); }
22436
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: SearchPageComponent, isStandalone: true, selector: "search-page", providers: [SmartFilterEditorService], viewQueries: [{ propertyName: "layoutComponent", first: true, predicate: SmartComponentLayoutComponent, descendants: true, isSignal: true }, { propertyName: "grid", first: true, predicate: ["grid"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"searchPageContainer\" [ngClass]=\"$safeNavigationMigration(data?.cssClassOfPage)\">\n @if (data?.showTitle) {\n <h1 class=\"search-page-title\"> {{ data?.pageTitle }} </h1>\n }\n <!-- <div class=\"filterContainer\">\n <smart-filter [filter]=\"filter\"></smart-filter>\n</div> -->\n@if (data?.showToolbar) {\n <smart-ui-action-toolbar [uiActionModels]=\"uiActionModels\"></smart-ui-action-toolbar>\n}\n@if (data?.showFilter && filterService.model) {\n <div class=\"filter-editor-container\">\n <smart-filter-group-params [service]=\"filterService\"></smart-filter-group-params>\n <smart-filter-expression-editor [service]=\"filterService\"></smart-filter-expression-editor>\n </div>\n}\n@if (data?.showLayout && layout) {\n <smart-component-layout\n [smartComponentLayout]=\"layout\"\n ></smart-component-layout>\n}\n@if (data?.showGrid) {\n <div class=\"gridContainer\">\n @if (isShowNoResultText()) {\n <h2 class=\"noResultText\">\n {{ data?.noResultText }}\n </h2>\n }\n @if (!isShowNoResultText()) {\n <smart-grid\n #grid\n [smartGrid]=\"smartGrid\"\n [uuid]=\"uuid!\"\n [parentLayoutComponent]=\"layoutComponent()\"\n ></smart-grid>\n }\n </div>\n}\n</div>\n", styles: [".searchPageContainer{display:flex;flex-direction:column;gap:1.5rem}.filterContainer{display:flex;flex-direction:row;gap:1rem}.gridContainer{flex-grow:1}.filter-editor-container{display:flex;flex-direction:row}.noResultText{width:100%;text-align:center;padding-top:2rem;padding-bottom:2rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "executor", "widgetId", "nodeId", "actionParams", "scrollOnWrap", "toolbarPropertes"] }, { kind: "component", type: SmartFilterParamsComponent, selector: "smart-filter-group-params", inputs: ["service"] }, { kind: "component", type: SmartFilterEditorContentComponent, selector: "smart-filter-expression-editor", inputs: ["service"] }, { kind: "component", type: SmartComponentLayoutComponent, selector: "smart-component-layout", inputs: ["smartComponentLayout", "parentLayoutComponent", "gridRow"] }, { kind: "component", type: SmartGridComponent, selector: "smart-grid", inputs: ["smartGrid", "uuid", "parentLayoutComponent", "dev"] }] }); }
22362
22437
  }
22363
22438
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SearchPageComponent, decorators: [{
22364
22439
  type: Component,
22365
- args: [{ selector: 'search-page', providers: [SmartFilterEditorService], imports: [NgClass, UiActionToolbarComponent, SmartFilterParamsComponent, SmartFilterEditorContentComponent, SmartComponentLayoutComponent, SmartGridComponent], template: "<div class=\"searchPageContainer\" [ngClass]=\"$safeNavigationMigration(data?.cssClassOfPage)\">\n <h1 class=\"search-page-title\"> {{ data?.pageTitle }} </h1>\n <!-- <div class=\"filterContainer\">\n <smart-filter [filter]=\"filter\"></smart-filter>\n</div> -->\n<smart-ui-action-toolbar [uiActionModels]=\"uiActionModels\"></smart-ui-action-toolbar>\n@if (filterService.model) {\n <div class=\"filter-editor-container\">\n <smart-filter-group-params [service]=\"filterService\"></smart-filter-group-params>\n <smart-filter-expression-editor [service]=\"filterService\"></smart-filter-expression-editor>\n </div>\n}\n@if (layout) {\n <smart-component-layout\n [smartComponentLayout]=\"layout\"\n ></smart-component-layout>\n}\n<div class=\"gridContainer\">\n @if (isShowNoResultText()) {\n <h2 class=\"noResultText\">\n {{ data?.noResultText }}\n </h2>\n }\n @if (!isShowNoResultText()) {\n <smart-grid\n #grid\n [smartGrid]=\"smartGrid\"\n [uuid]=\"uuid!\"\n ></smart-grid>\n }\n</div>\n</div>\n", styles: [".searchPageContainer{display:flex;flex-direction:column;gap:1.5rem}.filterContainer{display:flex;flex-direction:row;gap:1rem}.gridContainer{flex-grow:1}.filter-editor-container{display:flex;flex-direction:row}.noResultText{width:100%;text-align:center;padding-top:2rem;padding-bottom:2rem}\n"] }]
22440
+ args: [{ selector: 'search-page', providers: [SmartFilterEditorService], imports: [NgClass, UiActionToolbarComponent, SmartFilterParamsComponent, SmartFilterEditorContentComponent, SmartComponentLayoutComponent, SmartGridComponent], template: "<div class=\"searchPageContainer\" [ngClass]=\"$safeNavigationMigration(data?.cssClassOfPage)\">\n @if (data?.showTitle) {\n <h1 class=\"search-page-title\"> {{ data?.pageTitle }} </h1>\n }\n <!-- <div class=\"filterContainer\">\n <smart-filter [filter]=\"filter\"></smart-filter>\n</div> -->\n@if (data?.showToolbar) {\n <smart-ui-action-toolbar [uiActionModels]=\"uiActionModels\"></smart-ui-action-toolbar>\n}\n@if (data?.showFilter && filterService.model) {\n <div class=\"filter-editor-container\">\n <smart-filter-group-params [service]=\"filterService\"></smart-filter-group-params>\n <smart-filter-expression-editor [service]=\"filterService\"></smart-filter-expression-editor>\n </div>\n}\n@if (data?.showLayout && layout) {\n <smart-component-layout\n [smartComponentLayout]=\"layout\"\n ></smart-component-layout>\n}\n@if (data?.showGrid) {\n <div class=\"gridContainer\">\n @if (isShowNoResultText()) {\n <h2 class=\"noResultText\">\n {{ data?.noResultText }}\n </h2>\n }\n @if (!isShowNoResultText()) {\n <smart-grid\n #grid\n [smartGrid]=\"smartGrid\"\n [uuid]=\"uuid!\"\n [parentLayoutComponent]=\"layoutComponent()\"\n ></smart-grid>\n }\n </div>\n}\n</div>\n", styles: [".searchPageContainer{display:flex;flex-direction:column;gap:1.5rem}.filterContainer{display:flex;flex-direction:row;gap:1rem}.gridContainer{flex-grow:1}.filter-editor-container{display:flex;flex-direction:row}.noResultText{width:100%;text-align:center;padding-top:2rem;padding-bottom:2rem}\n"] }]
22366
22441
  }], ctorParameters: () => [{ type: i0.Injector }, { type: SmartFilterEditorService }, { type: undefined, decorators: [{
22367
22442
  type: Inject,
22368
22443
  args: [SMART_SEARCH_PAGE_NAME]
@@ -22372,7 +22447,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
22372
22447
  }] }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { grid: [{
22373
22448
  type: ViewChild,
22374
22449
  args: ['grid']
22375
- }] } });
22450
+ }], layoutComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SmartComponentLayoutComponent), { isSignal: true }] }] } });
22376
22451
 
22377
22452
  class UiActionFileUploadDialogComponent {
22378
22453
  constructor() {