@acorex/platform 20.7.12 → 20.7.15

package/fesm2022/acorex-platform-layout-builder.mjs

@@ -1,4 +1,4 @@
-import * as i4 from '@angular/common';
+import * as i5 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Injectable, inject, input, model, signal, effect, output, viewChild, ChangeDetectionStrategy, Component, NgModule, EventEmitter, Output } from '@angular/core';
@@ -16,9 +16,10 @@ import { AXDecoratorModule } from '@acorex/components/decorators';
 import * as i3 from '@acorex/components/loading';
 import { AXLoadingModule } from '@acorex/components/loading';
 import { AXBasePageComponent } from '@acorex/components/page';
-import * as i5 from '@acorex/core/translation';
+import * as i6 from '@acorex/core/translation';
 import { AXTranslationModule } from '@acorex/core/translation';
-import { AXPExpressionEvaluatorService } from '@acorex/platform/core';
+import * as i4 from '@acorex/platform/core';
+import { AXPExpressionEvaluatorService, AXPComponentSlotModule } from '@acorex/platform/core';
 
 class AXPLayoutConversionService {
     constructor() {
@@ -2421,6 +2422,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXPDialogRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXPDialogRendererComponent, isStandalone: true, selector: "axp-dialog-renderer", outputs: { result: "result" }, viewQueries: [{ propertyName: "layoutRenderer", first: true, predicate: AXPLayoutRendererComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
+    <axp-component-slot name="dialog-header" [context]="context()"></axp-component-slot>
     <div class="ax-p-4">
       <axp-layout-renderer
         [layout]="config.definition"
@@ -2431,44 +2433,50 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
       </axp-layout-renderer>
     </div>
 
-    <ax-footer>
-      <ax-prefix>
-        @for (action of footerPrefixActions(); track $index) {
-          <ax-button
-            [disabled]="action.disabled || isFormLoading()"
-            [text]="(action.title | translate | async)!"
-            [look]="'outline'"
-            [color]="action.color"
-            (onClick)="executeAction(action)"
-          >
-            <ax-prefix>
-              <i class="{{ action.icon }}"></i>
-            </ax-prefix>
-          </ax-button>
-        }
-      </ax-prefix>
-      <ax-suffix>
-        @for (action of footerSuffixActions(); track $index) {
-          <ax-button
-            [disabled]="action.disabled || isSubmitting()"
-            [text]="(action.title | translate | async)!"
-            [look]="'solid'"
-            [color]="action.color"
-            (onClick)="executeAction(action)"
-          >
-            @if (isFormLoading()) {
-              <ax-loading></ax-loading>
-            }
-            @if (action.icon) {
+    <!-- Custom footer slot: if it has content, default footer is hidden -->
+    <axp-component-slot name="dialog-footer" #footerSlot="slot" [context]="context()"></axp-component-slot>
+    @if (footerSlot.isEmpty()) {
+      <ax-footer>
+        <ax-prefix>
+          <axp-component-slot name="dialog-footer-prefix" [context]="context()"></axp-component-slot>
+          @for (action of footerPrefixActions(); track $index) {
+            <ax-button
+              [disabled]="action.disabled || isFormLoading()"
+              [text]="(action.title | translate | async)!"
+              [look]="'outline'"
+              [color]="action.color"
+              (onClick)="executeAction(action)"
+            >
               <ax-prefix>
-                <ax-icon icon="{{ action.icon }}"></ax-icon>
+                <i class="{{ action.icon }}"></i>
               </ax-prefix>
-            }
-          </ax-button>
-        }
-      </ax-suffix>
-    </ax-footer>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AXPLayoutRendererComponent, selector: "axp-layout-renderer", inputs: ["layout", "context", "look", "mode"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i3.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.AXTranslatorPipe, name: "translate" }] }); }
+            </ax-button>
+          }
+        </ax-prefix>
+        <ax-suffix>
+          @for (action of footerSuffixActions(); track $index) {
+            <ax-button
+              [disabled]="action.disabled || isSubmitting()"
+              [text]="(action.title | translate | async)!"
+              [look]="'solid'"
+              [color]="action.color"
+              (onClick)="executeAction(action)"
+            >
+              @if (isFormLoading()) {
+                <ax-loading></ax-loading>
+              }
+              @if (action.icon) {
+                <ax-prefix>
+                  <ax-icon icon="{{ action.icon }}"></ax-icon>
+                </ax-prefix>
+              }
+            </ax-button>
+          }
+          <axp-component-slot name="dialog-footer-suffix" [context]="context()"></axp-component-slot>
+        </ax-suffix>
+      </ax-footer>
+    }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AXPLayoutRendererComponent, selector: "axp-layout-renderer", inputs: ["layout", "context", "look", "mode"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1$1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2$1.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i3.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPComponentSlotModule }, { kind: "directive", type: i4.AXPComponentSlotDirective, selector: "axp-component-slot", inputs: ["name", "host", "context"], exportAs: ["slot"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXPDialogRendererComponent, decorators: [{
             type: Component,
@@ -2482,8 +2490,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         AXDecoratorModule,
                         AXLoadingModule,
                         AXTranslationModule,
+                        AXPComponentSlotModule,
                     ],
                     template: `
+    <axp-component-slot name="dialog-header" [context]="context()"></axp-component-slot>
     <div class="ax-p-4">
       <axp-layout-renderer
         [layout]="config.definition"
@@ -2494,43 +2504,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
       </axp-layout-renderer>
     </div>
 
-    <ax-footer>
-      <ax-prefix>
-        @for (action of footerPrefixActions(); track $index) {
-          <ax-button
-            [disabled]="action.disabled || isFormLoading()"
-            [text]="(action.title | translate | async)!"
-            [look]="'outline'"
-            [color]="action.color"
-            (onClick)="executeAction(action)"
-          >
-            <ax-prefix>
-              <i class="{{ action.icon }}"></i>
-            </ax-prefix>
-          </ax-button>
-        }
-      </ax-prefix>
-      <ax-suffix>
-        @for (action of footerSuffixActions(); track $index) {
-          <ax-button
-            [disabled]="action.disabled || isSubmitting()"
-            [text]="(action.title | translate | async)!"
-            [look]="'solid'"
-            [color]="action.color"
-            (onClick)="executeAction(action)"
-          >
-            @if (isFormLoading()) {
-              <ax-loading></ax-loading>
-            }
-            @if (action.icon) {
+    <!-- Custom footer slot: if it has content, default footer is hidden -->
+    <axp-component-slot name="dialog-footer" #footerSlot="slot" [context]="context()"></axp-component-slot>
+    @if (footerSlot.isEmpty()) {
+      <ax-footer>
+        <ax-prefix>
+          <axp-component-slot name="dialog-footer-prefix" [context]="context()"></axp-component-slot>
+          @for (action of footerPrefixActions(); track $index) {
+            <ax-button
+              [disabled]="action.disabled || isFormLoading()"
+              [text]="(action.title | translate | async)!"
+              [look]="'outline'"
+              [color]="action.color"
+              (onClick)="executeAction(action)"
+            >
               <ax-prefix>
-                <ax-icon icon="{{ action.icon }}"></ax-icon>
+                <i class="{{ action.icon }}"></i>
               </ax-prefix>
-            }
-          </ax-button>
-        }
-      </ax-suffix>
-    </ax-footer>
+            </ax-button>
+          }
+        </ax-prefix>
+        <ax-suffix>
+          @for (action of footerSuffixActions(); track $index) {
+            <ax-button
+              [disabled]="action.disabled || isSubmitting()"
+              [text]="(action.title | translate | async)!"
+              [look]="'solid'"
+              [color]="action.color"
+              (onClick)="executeAction(action)"
+            >
+              @if (isFormLoading()) {
+                <ax-loading></ax-loading>
+              }
+              @if (action.icon) {
+                <ax-prefix>
+                  <ax-icon icon="{{ action.icon }}"></ax-icon>
+                </ax-prefix>
+              }
+            </ax-button>
+          }
+          <axp-component-slot name="dialog-footer-suffix" [context]="context()"></axp-component-slot>
+        </ax-suffix>
+      </ax-footer>
+    }
   `,
                 }]
         }], propDecorators: { result: [{