@acorex/platform 21.0.0-next.40 → 21.0.0-next.41

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

@@ -6,7 +6,7 @@ import { provideCommandSetups } from '@acorex/platform/runtime';
 import { AXPopupService } from '@acorex/components/popup';
 import * as i1 from '@acorex/platform/layout/widget-core';
 import { AXPWidgetSerializationHelper, AXPWidgetContainerComponent, AXPPageStatus, AXPWidgetCoreModule, AXPWidgetRegistryService } from '@acorex/platform/layout/widget-core';
-import { cloneDeep, isNil, set, isEqual } from 'lodash-es';
+import { cloneDeep, isNil, set, isEqual, merge } from 'lodash-es';
 import * as i2 from '@acorex/components/form';
 import { AXFormComponent, AXFormModule } from '@acorex/components/form';
 import { Subject, debounceTime, distinctUntilChanged, startWith } from 'rxjs';
@@ -531,11 +531,21 @@ class LayoutBuilder {
         return this;
     }
     build() {
-        return {
-            type: this.root.type,
-            children: this.root.children,
-            mode: this.root.mode,
+        const r = this.root;
+        const node = {
+            type: r.type,
+            ...(r.mode !== undefined ? { mode: r.mode } : {}),
+            ...(r.children !== undefined ? { children: r.children } : {}),
+            ...(r.options !== undefined ? { options: r.options } : {}),
+            ...(r.name !== undefined ? { name: r.name } : {}),
+            ...(r.path !== undefined ? { path: r.path } : {}),
+            ...(r.visible !== undefined ? { visible: r.visible } : {}),
+            ...(r.defaultValue !== undefined ? { defaultValue: r.defaultValue } : {}),
+            ...(r.triggers !== undefined ? { triggers: r.triggers } : {}),
+            ...(r.meta !== undefined ? { meta: r.meta } : {}),
+            ...(r.valueTransforms !== undefined ? { valueTransforms: r.valueTransforms } : {}),
         };
+        return node;
     }
     /**
      * Converts the built widget node to JSON string
@@ -1009,6 +1019,24 @@ class FlexContainerBuilder extends WidgetContainerMixin {
  * Extracts flat grid-item options from AXPGridLayoutOptions for grid-item-layout widget.
  * Uses first available breakpoint (lg, xl, md, sm).
  */
+/**
+ * Deep-merges grid breakpoint buckets so sequential fluent calls (e.g. setColumns then setGap)
+ * do not wipe sibling keys under options.grid.default.
+ */
+function mergeAXPGridContainerOptions(prev, patch) {
+    const next = { ...(prev ?? {}), ...patch };
+    if (prev?.grid?.default || patch.grid?.default) {
+        next.grid = {
+            ...(prev?.grid ?? {}),
+            ...(patch.grid ?? {}),
+            default: {
+                ...(prev?.grid?.default ?? {}),
+                ...(patch.grid?.default ?? {}),
+            },
+        };
+    }
+    return next;
+}
 function toGridItemOptions(layoutOptions) {
     if (!layoutOptions?.positions)
         return { colSpan: 12 };
@@ -1038,7 +1066,7 @@ class GridContainerBuilder extends WidgetContainerMixin {
         super('grid-layout');
     }
     setOptions(options) {
-        this.containerState.options = { ...this.containerState.options, ...options };
+        this.containerState.options = mergeAXPGridContainerOptions(this.containerState.options, options);
         return this;
     }
     item(layoutOptions, delegate) {
@@ -2345,7 +2373,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
     }
     async executeAction(action) {
         const cmd = this.resolveActionCommandName(action.command);
-        if (cmd !== 'cancel') {
+        if (this.shouldValidateBeforeAction(cmd)) {
             const isValid = await this.layoutRenderer()?.validate();
             if (!isValid?.result) {
                 return;
@@ -2354,7 +2382,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         if (cmd?.startsWith('widget:')) {
             const parsed = this.parseWidgetCommand(cmd);
             if (parsed.widgetName && parsed.action) {
-                await this.executeWidgetApi(parsed.widgetName, parsed.action);
+                await this.invokeWidget(parsed.widgetName, parsed.action, {});
                 await this.aggregateAndEvaluateActions();
                 return;
             }
@@ -2362,17 +2390,15 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         const context = this.context();
         const onAction = this.config?.onAction;
         if (onAction) {
-            const dialogRef = {
-                close: (res) => this.close(res),
-                context: () => this.context(),
-                action: () => action.command ?? undefined,
-                setLoading: (loading) => this.isDialogLoading.set(loading),
-            };
+            const dialogRef = this.createDialogRef(cmd);
             try {
                 this.isDialogLoading.set(true);
                 const result = await Promise.resolve(onAction(dialogRef));
+                if (result && typeof result === 'object' && result.keepDialogOpen) {
+                    return;
+                }
                 this.callBack(result);
-                this.close(result);
+                await this.closeWithOptionalSkipValidate(result);
             }
             catch {
                 // Handler threw: stay open for retry, actions remain clickable
@@ -2390,20 +2416,48 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
             this.data.action = result.action;
         }
         this.callBack({
-            close: (res) => {
-                this.close(res);
-            },
-            context: () => this.context(),
+            ...this.createDialogRef(cmd),
             action: () => result.action,
-            setLoading: (loading) => {
-                this.isDialogLoading.set(loading);
-            },
         });
         // Without `onAction`, only the configured cancel action dismisses the dialog (not submit/custom).
         if (cmd === 'cancel') {
             await this.close(result);
         }
     }
+    /** Whether the layout form should be validated before running this footer command. */
+    shouldValidateBeforeAction(cmd) {
+        if (!cmd || cmd === 'cancel' || cmd === 'entity-form-done') {
+            return false;
+        }
+        if (cmd.startsWith('widget:')) {
+            return false;
+        }
+        return true;
+    }
+    createDialogRef(actionCmd) {
+        return {
+            close: (res) => {
+                void this.closeWithOptionalSkipValidate(res);
+            },
+            context: () => this.context(),
+            action: () => actionCmd,
+            setLoading: (loading) => this.isDialogLoading.set(loading),
+            patchContext: (partial) => {
+                const merged = merge({}, this.context(), partial);
+                this.context.set(merged);
+                this.layoutRenderer()?.updateContext(merged);
+            },
+            invokeWidget: (widgetName, method, opts) => this.invokeWidget(widgetName, method, opts ?? {}),
+        };
+    }
+    async closeWithOptionalSkipValidate(result) {
+        if (result && typeof result === 'object' && result.skipValidate) {
+            this.result.emit(result);
+            await super.close(result);
+            return;
+        }
+        await this.close(result);
+    }
     /** Resolves footer/widget action command to a string (e.g. `cancel`, `submit`, `widget:...`). */
     resolveActionCommandName(command) {
         if (typeof command === 'string') {
@@ -2424,7 +2478,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
             return {};
         return { widgetName: rest.slice(0, dot), action: rest.slice(dot + 1) };
     }
-    async executeWidgetApi(widgetName, apiMethod) {
+    async invokeWidget(widgetName, apiMethod, opts) {
         if (!this.widgetCoreService)
             return;
         try {
@@ -2434,16 +2488,20 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
             if (typeof fn === 'function') {
                 await Promise.resolve(fn({
                     close: (result) => {
-                        this.close(result);
+                        void this.closeWithOptionalSkipValidate(result);
                     },
                     context: () => this.context(),
                     setLoading: (loading) => {
-                        this.isDialogLoading.set(loading);
+                        (opts.setLoading ?? ((v) => this.isDialogLoading.set(v)))(loading);
                     },
                 }));
+                // Footer predicates (e.g. wizard step) must refresh when the widget advances outside executeAction (e.g. dialogRef.invokeWidget after entity-form continue).
+                await this.aggregateAndEvaluateActions();
             }
         }
-        catch { }
+        catch {
+            //
+        }
     }
     async close(result) {
         if (result) {
@@ -2493,6 +2551,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
             zone: 'footer',
             placement,
             scope: a.scope,
+            predicateApiWidgetName: a.predicateApiWidgetName,
         });
         const prefix = (footer?.prefix || []).map((a) => mapOne(a, 'prefix'));
         const suffix = (footer?.suffix || []).map((a) => mapOne(a, 'suffix'));
@@ -2502,16 +2561,18 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         const out = [];
         for (const a of actions) {
             const parsed = typeof a.command === 'string' ? this.parseWidgetCommand(a.command) : {};
-            const api = parsed.widgetName ? await this.resolveApi(parsed.widgetName) : undefined;
+            const widgetNameForApi = parsed.widgetName ?? a.predicateApiWidgetName;
+            const api = widgetNameForApi ? await this.resolveApi(widgetNameForApi) : undefined;
             const scope = {
                 api,
-                widget: { name: parsed.widgetName },
+                widget: { name: widgetNameForApi },
                 dialog: { context: this.context() },
                 context: this.context(),
             };
             const disabled = await this.evalBool(a.disabled, scope);
             const hidden = await this.evalBool(a.hidden, scope);
-            out.push({ ...a, disabled, hidden });
+            const resolvedTitle = (await this.evalActionTitle(a.title, scope)) ?? a.title;
+            out.push({ ...a, disabled, hidden, title: resolvedTitle });
         }
         return out;
     }
@@ -2529,6 +2590,25 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         }
         return value;
     }
+    /** Resolves footer action title when it contains {{ ... }} (e.g. wizard labels from dialog context). */
+    async evalActionTitle(value, scope) {
+        if (value == null || typeof value !== 'string' || !value.includes('{{')) {
+            return value;
+        }
+        try {
+            const result = await this.expressionEvaluator.evaluate(value, scope);
+            if (typeof result === 'string' && result.length > 0) {
+                return result;
+            }
+            if (result != null && result !== false) {
+                return String(result);
+            }
+        }
+        catch {
+            //
+        }
+        return value;
+    }
     async resolveApi(widgetName) {
         try {
             await this.widgetCoreService?.waitForWidget(widgetName, 2000);
@@ -2543,6 +2623,9 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: AXPDialogRendererComponent, isStandalone: true, selector: "axp-dialog-renderer", outputs: { result: "result" }, providers: [AXPContextStore], 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">
+      @if (config.message) {
+        <p class="ax-mb-4 ax-leading-relaxed">{{ config.message | translate | async }}</p>
+      }
       <axp-layout-renderer
         [layout]="config.definition"
         [context]="context()"
@@ -2616,6 +2699,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                     template: `
     <axp-component-slot name="dialog-header" [context]="context()"></axp-component-slot>
     <div class="ax-p-4">
+      @if (config.message) {
+        <p class="ax-mb-4 ax-leading-relaxed">{{ config.message | translate | async }}</p>
+      }
       <axp-layout-renderer
         [layout]="config.definition"
         [context]="context()"