@acorex-platform/framework-client 0.0.10 → 0.0.14

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

@@ -2,11 +2,12 @@ import * as i5 from '@angular/common';
 import { CommonModule, DOCUMENT } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Injectable, inject, input, model, signal, computed, effect, output, viewChild, ChangeDetectionStrategy, Component, NgModule, EventEmitter, ElementRef, DestroyRef, untracked, Output } from '@angular/core';
-import { provideCommandSetups, AXPCommandService } from '@acorex-platform/framework-client/runtime';
-import { AXPopupService } from '@acorex/components/popup';
 import * as i4 from '@acorex-platform/framework-client/core';
-import { AXPHookService, resolveDialogActionShortcuts, DEFAULT_CANCEL_DIALOG_ACTION_SHORTCUTS, DEFAULT_SUBMIT_DIALOG_ACTION_SHORTCUTS, findOverlayContainerAncestor, getNestedVisibleOverlayPanes, getTopVisibleOverlayContainer, AXPExpressionEvaluatorService, AXPKeyboardShortcutRegistry, normalizeDialogActionShortcutChord, isDialogShortcutAllowedInEditableField, resolveConfiguredFooterActionShortcuts, AXPComponentSlotModule, AXPContextStore } from '@acorex-platform/framework-client/core';
+import { AXPHookService, resolveDialogActionShortcuts, DEFAULT_CANCEL_DIALOG_ACTION_SHORTCUTS, DEFAULT_SUBMIT_DIALOG_ACTION_SHORTCUTS, AXP_SETTINGS_DEFINITION_DIALOG_OPENER, findOverlayContainerAncestor, getNestedVisibleOverlayPanes, getTopVisibleOverlayContainer, AXPExpressionEvaluatorService, AXPKeyboardShortcutRegistry, normalizeDialogActionShortcutChord, isDialogShortcutAllowedInEditableField, resolveConfiguredFooterActionShortcuts, AXPComponentSlotModule, AXPContextStore } from '@acorex-platform/framework-client/core';
 export { DEFAULT_CANCEL_DIALOG_ACTION_SHORTCUTS, DEFAULT_SUBMIT_DIALOG_ACTION_SHORTCUTS } from '@acorex-platform/framework-client/core';
+import { provideCommandSetups, AXPCommandService } from '@acorex-platform/framework-client/runtime';
+import { AXP_PREVIEW_WIDGET_FIELD_COMMAND_KEY, AXPKeyboardShortcutPriority } from '@acorex-platform/framework-shared/core';
+import { AXPopupService } from '@acorex/components/popup';
 import * as i1 from '@acorex-platform/framework-client/layout/widget-core';
 import { AXPWidgetSerializationHelper, AXPWidgetContainerComponent, AXPWidgetCoreModule, AXPWidgetRegistryService } from '@acorex-platform/framework-client/layout/widget-core';
 import { cloneDeep, isNil, set, isEqual, merge } from 'lodash-es';
@@ -14,7 +15,6 @@ import { AXPPageStatus } from '@acorex-platform/framework-shared/widget-core';
 import * as i2 from '@acorex/components/form';
 import { AXFormComponent, AXFormModule } from '@acorex/components/form';
 import { Subject, debounceTime, distinctUntilChanged, startWith } from 'rxjs';
-import { AXP_PREVIEW_WIDGET_FIELD_COMMAND_KEY, AXPKeyboardShortcutPriority } from '@acorex-platform/framework-shared/core';
 import { AXOverlayService } from '@acorex/cdk/overlay';
 import * as i1$1 from '@acorex/components/button';
 import { AXButtonModule } from '@acorex/components/button';
@@ -2366,9 +2366,13 @@ class AXPLayoutRendererComponent {
             [mode]="effectiveRenderMode()"
           ></ng-container>
         }
-      </axp-widgets-container>
+       </axp-widgets-container>
+        <ax-validation-summary
+          [displayMode]="'toast'"
+          [autoHide]="true"
+        ></ax-validation-summary>
     </ax-form>
-  `, isInline: true, styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i1.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetContainerComponent, selector: "axp-widgets-container", inputs: ["context", "functions"], outputs: ["onContextChanged"] }, { kind: "directive", type: i1.AXPWidgetRendererDirective, selector: "[axp-widget-renderer]", inputs: ["parentNode", "index", "mode", "node"], outputs: ["onOptionsChanged", "onValueChanged", "onLoad"], exportAs: ["widgetRenderer"] }, { kind: "ngmodule", type: AXFormModule }, { kind: "component", type: i2.AXFormComponent, selector: "ax-form", inputs: ["disabled", "readonly", "labelMode", "look", "messageStyle", "updateOn", "inUserInteractionActive"], outputs: ["onValidate", "updateOnChange"] }, { kind: "component", type: i2.AXValidationSummaryComponent, selector: "ax-validation-summary", inputs: ["title", "displayMode", "timeOut", "autoHide"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPLayoutRendererComponent, decorators: [{
             type: Component,
@@ -2382,16 +2386,99 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
             [mode]="effectiveRenderMode()"
           ></ng-container>
         }
-      </axp-widgets-container>
+       </axp-widgets-container>
+        <ax-validation-summary
+          [displayMode]="'toast'"
+          [autoHide]="true"
+        ></ax-validation-summary>
     </ax-form>
   `, styles: [":host{display:block;width:100%}\n"] }]
         }], propDecorators: { layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: true }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }, { type: i0.Output, args: ["contextChange"] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], contextInitiated: [{ type: i0.Output, args: ["contextInitiated"] }], validityChange: [{ type: i0.Output, args: ["validityChange"] }], form: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXFormComponent), { isSignal: true }] }], container: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPWidgetContainerComponent), { isSignal: true }] }] } });
 
+//#region ---- Settings definition dialog opener ----
+function appendSettingField(flex, setting) {
+    flex.formField(setting.title, (formField) => {
+        formField.path(setting.name);
+        if (setting.description) {
+            formField.setOptions({
+                hint: setting.description,
+                hintDisplayMode: 'note',
+            });
+        }
+        formField.customWidget(setting.widget.type, {
+            ...(setting.widget.options ?? {}),
+            ...(setting.isRequired ? { validations: [{ rule: 'required' }] } : {}),
+        });
+    });
+}
+class AXPSettingsDefinitionDialogOpenerService {
+    constructor() {
+        this.layoutBuilder = inject(AXPLayoutBuilderService);
+    }
+    async open(request) {
+        const { config, context, scope, settings } = request;
+        try {
+            const result = await this.layoutBuilder
+                .create()
+                .dialog((dialog) => {
+                dialog
+                    .setTitle(config.title)
+                    .setMessage(config.description)
+                    .setSize(config.size ?? 'md')
+                    .setCloseButton(true)
+                    .setContext(context)
+                    .content((flex) => {
+                    flex.setDirection('column').setGap('16px');
+                    for (const section of config.sections) {
+                        for (const setting of section.settings) {
+                            appendSettingField(flex, setting);
+                        }
+                    }
+                })
+                    .setActions((actions) => {
+                    actions.cancel('@general:actions.cancel.title').submit('@general:actions.apply.title');
+                })
+                    .onAction(async (dialogRef) => {
+                    const action = dialogRef.action();
+                    if (action === 'cancel') {
+                        return { saved: false };
+                    }
+                    const ctx = dialogRef.context();
+                    if (!ctx) {
+                        return { saved: false };
+                    }
+                    const values = {};
+                    for (const setting of settings) {
+                        values[setting.name] = ctx[setting.name];
+                    }
+                    await scope.set(values, { flush: true });
+                    return { saved: true };
+                });
+            })
+                .show();
+            return Boolean(result?.saved);
+        }
+        catch {
+            return false;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSettingsDefinitionDialogOpenerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSettingsDefinitionDialogOpenerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPSettingsDefinitionDialogOpenerService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
 class LayoutBuilderModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutBuilderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.9", ngImport: i0, type: LayoutBuilderModule, imports: [CommonModule, AXPLayoutRendererComponent], exports: [AXPLayoutRendererComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: LayoutBuilderModule, providers: [
             AXPLayoutBuilderService,
+            {
+                provide: AXP_SETTINGS_DEFINITION_DIALOG_OPENER,
+                useExisting: AXPSettingsDefinitionDialogOpenerService,
+            },
             provideCommandSetups([
                 {
                     key: AXP_PREVIEW_WIDGET_FIELD_COMMAND_KEY,
@@ -2406,6 +2493,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                     imports: [CommonModule, AXPLayoutRendererComponent],
                     providers: [
                         AXPLayoutBuilderService,
+                        {
+                            provide: AXP_SETTINGS_DEFINITION_DIALOG_OPENER,
+                            useExisting: AXPSettingsDefinitionDialogOpenerService,
+                        },
                         provideCommandSetups([
                             {
                                 key: AXP_PREVIEW_WIDGET_FIELD_COMMAND_KEY,
@@ -2417,6 +2508,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                 }]
         }] });
 
+/**
+ * Maps `dialog().show()` result to a typed form payload or `null` when cancelled / closed.
+ *
+ * Footer cancel typically returns `null` from `onAction`. Header X / Esc resolves to an
+ * {@link AXPDialogRef} with `action() === 'cancel'` and **does not** run `onAction` — callers must
+ * use this helper (or the same check) before treating a truthy result as form data.
+ */
+function resolveLayoutBuilderDialogResult(result) {
+    if (result == null) {
+        return null;
+    }
+    const dialogRef = result;
+    if (typeof dialogRef.action === 'function' && dialogRef.action() === 'cancel') {
+        return null;
+    }
+    return result;
+}
+/**
+ * Builds the `show()` resolve payload for layout-builder custom footer commands (fallback path).
+ */
+function buildLayoutBuilderCustomActionRef(createDialogRef, command) {
+    return {
+        ...createDialogRef(command),
+        action: () => command,
+    };
+}
+/**
+ * Keeps legacy popup `data.context` / `data.action` side fields in sync for custom footer commands.
+ */
+function syncLegacyDialogDataSideFields(data, context, action) {
+    if (!data) {
+        return;
+    }
+    data.context = context;
+    data.action = action;
+}
+/**
+ * Cancel from an `onAction` handler should route through the dirty-close gate only when configured.
+ * Otherwise preserve the original resolve-then-close sequence.
+ */
+function shouldRouteOnActionCancelThroughDismissGate(confirmCloseWhenDirtyEnabled) {
+    return confirmCloseWhenDirtyEnabled === true;
+}
+
 //#region ---- Contracts barrel ----
 //#endregion
 
@@ -2476,33 +2611,6 @@ function shouldDeferDialogShortcutsToNestedOverlay(document, dialogHost, overlay
     return shouldDeferEscapeToNestedOverlayFromDom(document, dialogHost);
 }
 
-/**
- * Builds the `show()` resolve payload for layout-builder custom footer commands (fallback path).
- */
-function buildLayoutBuilderCustomActionRef(createDialogRef, command) {
-    return {
-        ...createDialogRef(command),
-        action: () => command,
-    };
-}
-/**
- * Keeps legacy popup `data.context` / `data.action` side fields in sync for custom footer commands.
- */
-function syncLegacyDialogDataSideFields(data, context, action) {
-    if (!data) {
-        return;
-    }
-    data.context = context;
-    data.action = action;
-}
-/**
- * Cancel from an `onAction` handler should route through the dirty-close gate only when configured.
- * Otherwise preserve the original resolve-then-close sequence.
- */
-function shouldRouteOnActionCancelThroughDismissGate(confirmCloseWhenDirtyEnabled) {
-    return confirmCloseWhenDirtyEnabled === true;
-}
-
 /** Debounce after widget count stabilizes before re-evaluating footer actions. */
 const DIALOG_WIDGET_COUNT_STABLE_DELAY_MS = 350;
 class AXPDialogRendererComponent extends AXBasePageComponent {
@@ -2804,6 +2912,7 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         if (onAction) {
             const dialogRef = this.createDialogRef(cmd);
             try {
+                this.isDialogLoading.set(true);
                 const result = await Promise.resolve(onAction(dialogRef));
                 if (this.shouldKeepDialogOpenAfterCommandResult(result)) {
                     return;
@@ -2945,14 +3054,15 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
         return { widgetName: rest.slice(0, dot), action: rest.slice(dot + 1) };
     }
     async invokeWidget(widgetName, apiMethod, opts) {
-        if (!this.widgetCoreService)
-            return;
+        if (!this.widgetCoreService) {
+            return undefined;
+        }
         try {
             const widget = this.widgetCoreService.getWidget(widgetName);
             const api = widget?.api?.();
             const fn = api?.[apiMethod];
             if (typeof fn === 'function') {
-                await Promise.resolve(fn({
+                const result = await Promise.resolve(fn({
                     close: (result) => {
                         void this.closeWithOptionalSkipValidate(result);
                     },
@@ -2963,11 +3073,13 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
                 }));
                 // 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();
+                return result;
             }
         }
         catch {
             //
         }
+        return undefined;
     }
     async close(result, options) {
         if (options?.skipDirtyConfirm) {
@@ -3098,9 +3210,9 @@ class AXPDialogRendererComponent extends AXBasePageComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXPDialogRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     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">
+    <div class="p-4">
       <!-- @if (config.message) {
-        <p class="ax-mb-4 ax-leading-relaxed">{{ config.message | translate | async }}</p>
+        <p class="mb-4 leading-relaxed">{{ config.message | translate | async }}</p>
       } -->
       <axp-layout-renderer
         [layout]="config.definition"
@@ -3179,9 +3291,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: `
     <axp-component-slot name="dialog-header" [context]="context()"></axp-component-slot>
-    <div class="ax-p-4">
+    <div class="p-4">
       <!-- @if (config.message) {
-        <p class="ax-mb-4 ax-leading-relaxed">{{ config.message | translate | async }}</p>
+        <p class="mb-4 leading-relaxed">{{ config.message | translate | async }}</p>
       } -->
       <axp-layout-renderer
         [layout]="config.definition"
@@ -3435,5 +3547,5 @@ var previewWidgetField_command = /*#__PURE__*/Object.freeze({
  * Generated bundle index. Do not edit.
  */
 
-export { AXPDialogRendererComponent, AXPLayoutBuilderService, AXPLayoutConversionService, AXPLayoutRendererComponent, AXPPreviewWidgetFieldCommand, AXP_LAYOUT_BUILDER_DIALOG_BEFORE_OPEN_HOOK_KEY, AXP_LAYOUT_BUILDER_DIALOG_CONFIG_HOOK_KEY, AXP_LAYOUT_BUILDER_DIALOG_CONTEXT_CHANGED_HOOK_KEY, LayoutBuilderModule, createDismissedDialogRef };
+export { AXPDialogRendererComponent, AXPLayoutBuilderService, AXPLayoutConversionService, AXPLayoutRendererComponent, AXPPreviewWidgetFieldCommand, AXPSettingsDefinitionDialogOpenerService, AXP_LAYOUT_BUILDER_DIALOG_BEFORE_OPEN_HOOK_KEY, AXP_LAYOUT_BUILDER_DIALOG_CONFIG_HOOK_KEY, AXP_LAYOUT_BUILDER_DIALOG_CONTEXT_CHANGED_HOOK_KEY, LayoutBuilderModule, buildLayoutBuilderCustomActionRef, createDismissedDialogRef, resolveLayoutBuilderDialogResult, shouldRouteOnActionCancelThroughDismissGate, syncLegacyDialogDataSideFields };
 //# sourceMappingURL=acorex-platform-framework-client-layout-builder.mjs.map