@acorex-platform/module-workplacesafety-management-client 0.0.33 → 0.0.38

package/fesm2022/{acorex-platform-module-workplacesafety-management-client-index-LxP1eZLY.mjs → acorex-platform-module-workplacesafety-management-client-index-gbDgxqrV.mjs}

@@ -1,31 +1,33 @@
-import { AXPWidgetsList, AXPWidgetsCatalog, AXPSystemStatusType } from '@acorex-platform/framework-shared/core';
-import { resolveEntityRowDisplayText } from '@acorex-platform/framework-client/common';
-import { AXPDataGenerator, AXPDeviceService, AXPHookService } from '@acorex-platform/framework-client/core';
+import { AXPDataGenerator, AXPContextStore } from '@acorex-platform/framework-client/core';
 import { AXPEntityDataSelectorService, AXPEntityDefinitionRegistryService, AXPEntityService } from '@acorex-platform/framework-client/layout/entity';
-import { AXPCommandService, AXPRuntimeRemoteHookKeys } from '@acorex-platform/framework-client/runtime';
-import { AXPLayoutBuilderService, resolveLayoutBuilderDialogResult } from '@acorex-platform/framework-client/layout/builder';
+import { AXPCommandService } from '@acorex-platform/framework-client/runtime';
 import { AXPPageLayoutBaseComponent, AXPPageLayoutBase } from '@acorex-platform/framework-client/layout/views';
-import { resolveSectionTypeKey, asSafetyPlanDisplayText, resolveEntityRefId, clearDependentItemsOnParentChange, enrichSectionTypeSnapshot, isStepTableSectionType, WORKPLACE_SAFETY_SECTION_TYPE_LOOKUP_WIDGET_OPTIONS, RootConfig, normalizeStepTableColumns, resolveSafetyPlanSectionItemFilterAsync, resolveSafetyPlanSectionItemEntityKey, resolveSafetyPlanSectionItemColumns, mapSafetyPlanSectionSelectedItems, dedupeSafetyPlanSectionItemSelection, sortStepTableColumns, stepTableColumnKey, resolveStepTableColumnLookupEntity, isStepTableColumnMultiLookup, stepTableColumnTitle, normalizeStepTableRows, AXMWorkplaceSafetyManagementCommandKeys, dedupeSafetyPlanSectionStructure, resolveSectionItemEntityName, collectBuiltInRepeatableSectionTypeIds, buildSectionStructureFromTypeSections, toBuilderValueFromStructure, SAFETY_PLAN_SECTIONS_PAGE_COMPONENT_KEY } from '@acorex-platform/module-workplacesafety-management-client/contracts';
+import { resolveSectionTypeKey, asSafetyPlanDisplayText, resolveEntityRefId, clearDependentItemsOnParentChange, enrichSectionTypeSnapshot, isStepTableSectionType, WORKPLACE_SAFETY_SECTION_TYPE_LOOKUP_WIDGET_OPTIONS, RootConfig, normalizeStepTableColumns, resolveSafetyPlanSectionItemFilterAsync, resolveSafetyPlanSectionItemEntityKey, resolveSafetyPlanSectionItemColumns, mapSafetyPlanSectionSelectedItems, dedupeSafetyPlanSectionItemSelection, sortStepTableColumns, stepTableColumnKey, resolveStepTableColumnLookupEntity, isStepTableColumnMultiLookup, stepTableColumnTitle, normalizeStepTableRows, dedupeSafetyPlanSectionStructure, resolveSectionItemEntityName, collectBuiltInRepeatableSectionTypeIds, pickSafetyPlanTypeSectionsForStructure, buildSectionStructureFromTypeSections, toBuilderValueFromStructure, SAFETY_PLAN_SECTIONS_PAGE_COMPONENT_KEY } from '@acorex-platform/module-workplacesafety-management-client/contracts';
 import * as i0 from '@angular/core';
-import { inject, Injectable, input, output, viewChild, signal, computed, effect, ChangeDetectionStrategy, Component, untracked } from '@angular/core';
+import { inject, Injectable, input, output, viewChild, signal, computed, effect, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
 import { isEqual, cloneDeep } from 'lodash';
-import { AXDialogService } from '@acorex/components/dialog';
+import * as i1$1 from '@acorex/components/skeleton';
+import { AXSkeletonModule } from '@acorex/components/skeleton';
+import { AXPWidgetsList, AXPWidgetsCatalog, AXPSystemStatusType } from '@acorex-platform/framework-shared/core';
 import * as i1 from '@acorex/components/button';
 import { AXButtonModule } from '@acorex/components/button';
 import * as i2 from '@acorex/components/decorators';
 import { AXDecoratorModule } from '@acorex/components/decorators';
 import { AXToastService } from '@acorex/components/toast';
-import * as i1$1 from '@acorex/core/translation';
+import * as i2$1 from '@acorex/core/translation';
 import { AXTranslationService, AXTranslationModule } from '@acorex/core/translation';
+import { AXPLayoutBuilderService } from '@acorex-platform/framework-client/layout/builder';
 import { AXPWidgetPropertyViewerService, AXPStandardSectionItemsBuilderComponent } from '@acorex-platform/framework-client/layout/components';
 import * as i3 from '@angular/common';
 import { CommonModule, AsyncPipe } from '@angular/common';
-import { n as normalizeSafetyPlanSectionBuilderValue, s as summarizeStepTableRow, S as SAFETY_PLAN_SECTIONS_SAVE_COMMAND, a as safetyPlanSectionsToBuilderValue, h as hydrateStepTableSectionsWithWorkSteps } from './acorex-platform-module-workplacesafety-management-client-save-safety-plan-sections.command-BlPzzCc2.mjs';
-export { A as AXMSaveSafetyPlanSectionsCommand } from './acorex-platform-module-workplacesafety-management-client-save-safety-plan-sections.command-BlPzzCc2.mjs';
-import { P as PPE_ITEM_VIEWER_WIDGET_NAME } from './acorex-platform-module-workplacesafety-management-client-acorex-platform-module-workplacesafety-management-client-mzaaZ6T3.mjs';
+import { n as normalizeSafetyPlanSectionBuilderValue, s as summarizeStepTableRow, a as safetyPlanSectionsToBuilderValue, h as hydrateStepTableSectionsWithWorkSteps } from './acorex-platform-module-workplacesafety-management-client-safety-plan-section-builder.types-LaN1NIgc.mjs';
+import { P as PPE_ITEM_VIEWER_WIDGET_NAME } from './acorex-platform-module-workplacesafety-management-client-acorex-platform-module-workplacesafety-management-client-Ds0Fkspp.mjs';
 import { AXP_BEHAVIOR_PROPERTY_GROUP } from '@acorex-platform/framework-client/layout/widgets';
 import { createBooleanProperty } from '@acorex-platform/framework-shared/widget-core';
-import { AXPopupService } from '@acorex/components/popup';
+import { SAFETY_PLAN_SECTIONS_SAVE_COMMAND } from './acorex-platform-module-workplacesafety-management-client-save-safety-plan-sections.command-CLj3y_JD.mjs';
+export { AXMSaveSafetyPlanSectionsCommand } from './acorex-platform-module-workplacesafety-management-client-save-safety-plan-sections.command-CLj3y_JD.mjs';
+import { A as AXMSafetyPlanPreviewService } from './acorex-platform-module-workplacesafety-management-client-safety-plan-preview.service-DJP41MuL.mjs';
+import { resolveEntityRowDisplayText } from '@acorex-platform/framework-client/common';
 
 //#region ----- Imports -----
 //#endregion
@@ -290,7 +292,11 @@ class AXMSafetyPlanSectionBuilderComponent {
         //#region ----- Lifecycle -----
         this.#syncValueToBuilder = effect(() => {
             const normalized = normalizeSafetyPlanSectionBuilderValue(this.value());
-            this.builderValue.set(this.toBuilderValue(normalized));
+            const next = this.toBuilderValue(normalized);
+            if (isEqual(untracked(() => this.builderValue()), next)) {
+                return;
+            }
+            this.builderValue.set(next);
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "#syncValueToBuilder" }] : /* istanbul ignore next */ []));
     }
@@ -1258,59 +1264,29 @@ class AXMSafetyPlanSectionBuilderComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanSectionBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXMSafetyPlanSectionBuilderComponent, isStandalone: true, selector: "axm-safety-plan-section-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, safetyPlanId: { classPropertyName: "safetyPlanId", publicName: "safetyPlanId", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "standardRef", first: true, predicate: AXPStandardSectionItemsBuilderComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"axm-safety-plan-section-builder\">\n  @if (!readonly() && !hideHeaderActions() && allowAddSection()) {\n    <div class=\"__header\">\n      <div class=\"__header-left\"></div>\n      <div class=\"__header-right\">\n        <ax-button\n          class=\"ax-sm\"\n          [text]=\"\n            '@workplacesafety-management:safety-plan-sections.entities.safety-plan-section.actions.add-section.title'\n              | translate\n              | async\n          \"\n          [color]=\"'primary'\"\n          (onClick)=\"addSection()\"\n        >\n          <ax-prefix>\n            <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </div>\n    </div>\n  }\n\n  <axp-standard-section-items-builder\n    class=\"block min-h-[200px]\"\n    [value]=\"builderValue()\"\n    [config]=\"standardConfig()\"\n    [readonly]=\"readonly()\"\n    (valueChange)=\"onBuilderValueChange($event)\"\n  />\n</div>\n", styles: [".axm-safety-plan-section-builder .__header{margin-bottom:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:space-between}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.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.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.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: AXTranslationModule }, { kind: "component", type: AXPStandardSectionItemsBuilderComponent, selector: "axp-standard-section-items-builder", inputs: ["value", "config", "readonly"], outputs: ["valueChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXMSafetyPlanSectionBuilderComponent, isStandalone: true, selector: "axm-safety-plan-section-builder", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, safetyPlanId: { classPropertyName: "safetyPlanId", publicName: "safetyPlanId", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "standardRef", first: true, predicate: AXPStandardSectionItemsBuilderComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"axm-safety-plan-section-builder\">\n  @if (!readonly() && !hideHeaderActions() && allowAddSection()) {\n    <div class=\"__header\">\n      <div class=\"__header-left\"></div>\n      <div class=\"__header-right\">\n        <ax-button\n          class=\"ax-sm\"\n          [text]=\"\n            '@workplacesafety-management:safety-plan-sections.entities.safety-plan-section.actions.add-section.title'\n              | translate\n              | async\n          \"\n          [color]=\"'primary'\"\n          (onClick)=\"addSection()\"\n        >\n          <ax-prefix>\n            <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </div>\n    </div>\n  }\n\n  <axp-standard-section-items-builder\n    class=\"block min-h-[200px]\"\n    [value]=\"builderValue()\"\n    [config]=\"standardConfig()\"\n    [readonly]=\"readonly()\"\n    (valueChange)=\"onBuilderValueChange($event)\"\n  />\n</div>\n", styles: [".axm-safety-plan-section-builder .__header{margin-bottom:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:space-between}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "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.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.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: AXTranslationModule }, { kind: "component", type: AXPStandardSectionItemsBuilderComponent, selector: "axp-standard-section-items-builder", inputs: ["value", "config", "readonly"], outputs: ["valueChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanSectionBuilderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'axm-safety-plan-section-builder', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXTranslationModule, AXPStandardSectionItemsBuilderComponent], template: "<div class=\"axm-safety-plan-section-builder\">\n  @if (!readonly() && !hideHeaderActions() && allowAddSection()) {\n    <div class=\"__header\">\n      <div class=\"__header-left\"></div>\n      <div class=\"__header-right\">\n        <ax-button\n          class=\"ax-sm\"\n          [text]=\"\n            '@workplacesafety-management:safety-plan-sections.entities.safety-plan-section.actions.add-section.title'\n              | translate\n              | async\n          \"\n          [color]=\"'primary'\"\n          (onClick)=\"addSection()\"\n        >\n          <ax-prefix>\n            <ax-icon icon=\"fa-light fa-layer-group\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </div>\n    </div>\n  }\n\n  <axp-standard-section-items-builder\n    class=\"block min-h-[200px]\"\n    [value]=\"builderValue()\"\n    [config]=\"standardConfig()\"\n    [readonly]=\"readonly()\"\n    (valueChange)=\"onBuilderValueChange($event)\"\n  />\n</div>\n", styles: [".axm-safety-plan-section-builder .__header{margin-bottom:calc(var(--spacing, .25rem) * 3);display:flex;align-items:center;justify-content:space-between}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
         }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], safetyPlanId: [{ type: i0.Input, args: [{ isSignal: true, alias: "safetyPlanId", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], standardRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPStandardSectionItemsBuilderComponent), { isSignal: true }] }] } });
 
-//#region ----- Imports -----
-//#endregion
-//#region ----- Service -----
-class AXMSafetyPlanPreviewService {
-    constructor() {
-        //#region ----- Services & Dependencies -----
-        this.popupService = inject(AXPopupService);
-        this.deviceService = inject(AXPDeviceService);
-    }
-    //#endregion
-    //#region ----- Public API -----
-    async open(options) {
-        const { AXMSafetyPlanPreviewModalComponent } = await import('./acorex-platform-module-workplacesafety-management-client-safety-plan-preview-modal.component-6i0RkG3L.mjs');
-        await this.popupService.open(AXMSafetyPlanPreviewModalComponent, {
-            title: options.title,
-            size: this.deviceService.isSmall() ? 'full' : 'lg',
-            data: {
-                structure: options.structure,
-            },
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanPreviewService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanPreviewService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanPreviewService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
 //#region ----   Imports   ----
 //#endregion
 //#region ----   Constants   ----
 const SAFETY_PLAN_SECTIONS_ADD_SECTION_COMMAND = 'SafetyPlan:Sections:AddSection';
 const SAFETY_PLAN_SECTIONS_PREVIEW_COMMAND = 'SafetyPlan:Sections:Preview';
 const SAFETY_PLAN_SECTIONS_DISCARD_COMMAND = 'SafetyPlan:Sections:Discard';
-const SAFETY_PLAN_SECTIONS_CHANGE_PLAN_TYPE_COMMAND = 'SafetyPlan:Sections:ChangePlanType';
 const SAFETY_PLAN_SECTION_ENTITY = `${RootConfig.module.name}.${RootConfig.entities.safetyPlanSection.name}`;
 const SAFETY_PLAN_WORK_STEP_ENTITY = `${RootConfig.module.name}.${RootConfig.entities.safetyPlanWorkStep.name}`;
 const SAFETY_PLAN_TYPE_SECTION_ENTITY = `${RootConfig.module.name}.${RootConfig.entities.safetyPlanTypeSection.name}`;
-const SAFETY_PLAN_TYPE_ENTITY = RootConfig.entities.safetyPlanType.source;
 const SECTION_TYPE_ENTITY = `${RootConfig.module.name}.${RootConfig.entities.sectionType.name}`;
 //#endregion
 //#region ----   Component   ----
 class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
     constructor() {
         super(...arguments);
+        /** Default `{}`: avoid NG0950 before page-component-renderer calls setInput. */
         this.rootContext = input({}, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "rootContext" }] : /* istanbul ignore next */ []));
         this.pageConfig = input(/* @ts-ignore */
@@ -1321,9 +1297,7 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
         ...(ngDevMode ? [{ debugName: "builderRef" }] : /* istanbul ignore next */ []));
         this.commandService = inject(AXPCommandService);
         this.entityService = inject(AXPEntityService);
-        this.dialogService = inject(AXDialogService);
-        this.layoutBuilder = inject(AXPLayoutBuilderService);
-        this.hooks = inject(AXPHookService);
+        this.contextStore = inject(AXPContextStore);
         this.hostPageLayout = inject(AXPPageLayoutBase, { optional: true, skipSelf: true });
         this.previewService = inject(AXMSafetyPlanPreviewService);
         this.baselineValue = signal(null, /* @ts-ignore */
@@ -1340,136 +1314,255 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
         ...(ngDevMode ? [{ debugName: "inflightSyncKey" }] : /* istanbul ignore next */ []));
         this.appliedPlanTypeId = signal(null, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "appliedPlanTypeId" }] : /* istanbul ignore next */ []));
-        /** Keeps plan type in sync after Change Plan Type when parent form context is mutated in place. */
-        this.planTypeOverride = signal(null, /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "planTypeOverride" }] : /* istanbul ignore next */ []));
+        this.appliedStructureId = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appliedStructureId" }] : /* istanbul ignore next */ []));
+        /**
+         * Bumped only when the user changes structure after a successful sync (see `#detectStructureUserChange`).
+         * Keeps `#syncFromContext` from tracking context `structureId` during unrelated context churn.
+         */
+        this.structureReloadToken = signal(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "structureReloadToken" }] : /* istanbul ignore next */ []));
+        /**
+         * Stable builder options — same pattern as questionnaire `prePostConfigStable`
+         * (new object every CD caused builder config thrash / flicker).
+         */
+        this.builderOptionsStable = signal({
+            hideHeaderActions: true,
+            readonly: false,
+            allowAddSection: true,
+            allowAddItems: true,
+            allowReorderSections: true,
+            allowEditSection: false,
+            allowEditItem: false,
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "builderOptionsStable" }] : /* istanbul ignore next */ []));
         this.safetyPlanId = computed(() => {
             const raw = this.rootContext()?.['id'];
             return typeof raw === 'string' && raw.length > 0 ? raw : null;
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "safetyPlanId" }] : /* istanbul ignore next */ []));
         this.planTypeId = computed(() => {
-            const override = this.planTypeOverride();
-            if (override) {
-                return override;
-            }
             const ctx = this.rootContext() ?? {};
             return (resolveEntityRefId(ctx['safetyPlanTypeId']) ??
                 resolveEntityRefId(ctx['safetyPlanType']?.id) ??
                 resolveEntityRefId(ctx['safetyPlanType']));
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "planTypeId" }] : /* istanbul ignore next */ []));
-        this.hasPlanType = computed(() => !!this.planTypeId(), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "hasPlanType" }] : /* istanbul ignore next */ []));
+        this.structureId = computed(() => {
+            const ctx = this.rootContext() ?? {};
+            return (resolveEntityRefId(ctx['structureId']) ??
+                resolveEntityRefId(ctx['structure']?.id) ??
+                resolveEntityRefId(ctx['structure']));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "structureId" }] : /* istanbul ignore next */ []));
+        this.hasStructure = computed(() => !!this.structureId(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasStructure" }] : /* istanbul ignore next */ []));
+        /**
+         * Covers the first paint before `#syncFromContext` sets `isLoadingStructure`, and the full sync span.
+         * Avoids flashing an empty builder after create-and-continue.
+         */
+        this.showStructureLoading = computed(() => {
+            if (this.isLoadingStructure()) {
+                return true;
+            }
+            if (!(this.safetyPlanId() || this.hasStructure())) {
+                return false;
+            }
+            return this.lastSyncedKey() == null && this.committedValue() == null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "showStructureLoading" }] : /* istanbul ignore next */ []));
         this.isDraftPlan = computed(() => {
             const status = this.rootContext()?.['status'];
             return !status || status === AXPSystemStatusType.Draft;
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "isDraftPlan" }] : /* istanbul ignore next */ []));
-        this.builderOptions = computed(() => ({
-            hideHeaderActions: true,
-            readonly: !this.isDraftPlan() || this.isLoadingStructure(),
-            allowAddSection: this.isDraftPlan() && !this.isLoadingStructure(),
-            allowAddItems: this.isDraftPlan() && !this.isLoadingStructure(),
-            allowReorderSections: this.isDraftPlan() && !this.isLoadingStructure(),
-            ...(this.pageConfig() ?? {}),
-            ...(this.options() ?? {}),
-            allowEditSection: false,
-            allowEditItem: false,
-        }), /* @ts-ignore */
+        /** Stable reference for the builder — updated only when option values change. */
+        this.builderOptions = computed(() => this.builderOptionsStable(), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "builderOptions" }] : /* istanbul ignore next */ []));
         this.isDirty = computed(() => {
             return !isEqual(this.baselineValue() ?? { sections: [] }, this.committedValue() ?? { sections: [] });
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "isDirty" }] : /* istanbul ignore next */ []));
+        /** Keep builder options stable across rootContext snapshot churn (questionnaire pattern). */
+        this.#stabilizeBuilderOptions = effect(() => {
+            const draft = this.isDraftPlan();
+            const next = {
+                hideHeaderActions: true,
+                readonly: !draft,
+                allowAddSection: draft,
+                allowAddItems: draft,
+                allowReorderSections: draft,
+                allowEditSection: false,
+                allowEditItem: false,
+            };
+            const current = untracked(() => this.builderOptionsStable());
+            if (!isEqual(current, next)) {
+                this.builderOptionsStable.set(next);
+            }
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#stabilizeBuilderOptions" }] : /* istanbul ignore next */ []));
+        /**
+         * Plan type changed on the form — clear structure and wait for a manual structure pick.
+         * Does not rebuild sections; structure selection drives the next load.
+         */
+        this.#detectPlanTypeUserChange = effect(() => {
+            const typeId = this.planTypeId();
+            const applied = untracked(() => this.appliedPlanTypeId());
+            if (!typeId || applied == null || typeId === applied) {
+                return;
+            }
+            this.appliedPlanTypeId.set(typeId);
+            this.appliedStructureId.set(null);
+            this.lastSyncedKey.set(null);
+            this.inflightSyncKey.set(null);
+            this.updateRootContextField('structureId', null);
+            this.updateRootContextField('structure', null);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#detectPlanTypeUserChange" }] : /* istanbul ignore next */ []));
+        /**
+         * User changed structure after a successful sync — bump token so `#syncFromContext` reloads.
+         */
+        this.#detectStructureUserChange = effect(() => {
+            const contextStructureId = this.structureId();
+            const applied = untracked(() => this.appliedStructureId());
+            if (!contextStructureId || applied == null) {
+                return;
+            }
+            if (contextStructureId === applied) {
+                return;
+            }
+            if (untracked(() => this.lastSyncedKey()) == null) {
+                return;
+            }
+            this.lastSyncedKey.set(null);
+            this.structureReloadToken.update((n) => n + 1);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#detectStructureUserChange" }] : /* istanbul ignore next */ []));
         this.#syncFromContext = effect((onCleanup) => {
+            this.structureReloadToken();
             const planId = this.safetyPlanId();
             const typeId = this.planTypeId();
-            const syncKey = `${planId ?? ''}|${typeId ?? ''}`;
-            // Already applied or already loading for this plan/type pair.
+            const structureId = this.structureId();
+            const syncKey = this.buildSyncKey(planId, typeId, structureId);
             if (untracked(() => this.lastSyncedKey()) === syncKey ||
                 untracked(() => this.inflightSyncKey()) === syncKey) {
                 return;
             }
+            const inflight = untracked(() => this.inflightSyncKey());
+            if (inflight && inflight.startsWith(`${planId ?? ''}|${typeId ?? ''}|`)) {
+                return;
+            }
             this.inflightSyncKey.set(syncKey);
             let cancelled = false;
+            let activeSyncKey = syncKey;
             const clearInflight = () => {
-                if (untracked(() => this.inflightSyncKey()) === syncKey) {
+                if (untracked(() => this.inflightSyncKey()) === activeSyncKey) {
                     this.inflightSyncKey.set(null);
                 }
             };
-            const markSynced = () => {
-                this.lastSyncedKey.set(syncKey);
-                clearInflight();
+            const markSynced = (finalStructureId = structureId) => {
+                activeSyncKey = this.buildSyncKey(planId, typeId, finalStructureId);
+                this.lastSyncedKey.set(activeSyncKey);
+                this.inflightSyncKey.set(null);
             };
             const run = async () => {
                 if (cancelled) {
                     return;
                 }
-                const repeatableSectionTypeIds = await this.loadRepeatableSectionTypeIds();
-                if (cancelled) {
-                    return;
-                }
-                // Edit: load independent saved sections once — never append type defaults on top.
-                if (planId) {
+                // Create (no plan yet): exit without SectionType query until structure defaults are needed.
+                if (!planId) {
+                    if (!typeId) {
+                        this.appliedPlanTypeId.set(null);
+                        this.appliedStructureId.set(null);
+                        this.applyStructure({ sections: [] }, { asBaseline: true });
+                        markSynced(null);
+                        return;
+                    }
+                    // Plan type alone must not auto-pick a structure or rebuild sections.
+                    if (!structureId) {
+                        this.appliedPlanTypeId.set(typeId);
+                        this.appliedStructureId.set(null);
+                        markSynced(null);
+                        return;
+                    }
                     this.isLoadingStructure.set(true);
                     try {
-                        const loaded = await this.fetchSectionsFromBackend(planId, repeatableSectionTypeIds);
-                        if (cancelled)
-                            return;
-                        if (loaded.sections.length > 0) {
-                            // Replace UI from backend (deduped). Never append defaults on top of saved rows.
-                            this.applyStructure(loaded, { asBaseline: true });
-                            this.appliedPlanTypeId.set(typeId);
-                            markSynced();
+                        const repeatableSectionTypeIds = await this.loadRepeatableSectionTypeIds();
+                        if (cancelled) {
                             return;
                         }
-                        // No saved rows yet — fall through to type defaults when type is known.
+                        const defaults = await this.loadDefaultsForStructure(typeId, structureId, repeatableSectionTypeIds);
+                        if (cancelled)
+                            return;
+                        this.applyStructure(defaults, { asBaseline: true });
+                        this.appliedPlanTypeId.set(typeId);
+                        this.appliedStructureId.set(structureId);
+                        markSynced(structureId);
                     }
                     catch {
                         if (cancelled)
                             return;
                         clearInflight();
                         await this.showStructureLoadError();
-                        return;
                     }
                     finally {
                         if (!cancelled) {
                             this.isLoadingStructure.set(false);
                         }
                     }
+                    return;
+                }
+                // Edit / create-and-continue: one continuous loading span through SectionType → sections → defaults.
+                this.isLoadingStructure.set(true);
+                try {
+                    const repeatableSectionTypeIds = await this.loadRepeatableSectionTypeIds();
                     if (cancelled) {
                         return;
                     }
-                }
-                if (!typeId) {
-                    this.appliedPlanTypeId.set(null);
-                    this.applyStructure({ sections: [] }, { asBaseline: true });
-                    markSynced();
-                    return;
-                }
-                const previousTypeId = untracked(() => this.appliedPlanTypeId());
-                const currentSections = untracked(() => this.committedValue()?.sections ?? []);
-                if (previousTypeId && previousTypeId !== typeId && currentSections.length > 0) {
-                    const confirmed = await this.confirmReplaceStructure();
+                    // Load independent saved sections once — never append type defaults on top.
+                    const previousStructureId = untracked(() => this.appliedStructureId());
+                    const structureChanged = !!structureId && !!previousStructureId && previousStructureId !== structureId;
+                    if (structureChanged && this.isDraftPlan()) {
+                        const defaults = await this.loadDefaultsForStructure(typeId ?? '', structureId, repeatableSectionTypeIds);
+                        if (cancelled)
+                            return;
+                        this.applyStructure(defaults, { asBaseline: true });
+                        this.appliedPlanTypeId.set(typeId);
+                        this.appliedStructureId.set(structureId);
+                        markSynced(structureId);
+                        return;
+                    }
+                    const loaded = await this.fetchSectionsFromBackend(planId, repeatableSectionTypeIds);
                     if (cancelled)
                         return;
-                    if (!confirmed) {
-                        // Keep previous structure; mark new type as handled so we do not loop.
+                    if (loaded.sections.length > 0) {
+                        this.applyStructure(loaded, { asBaseline: true });
                         this.appliedPlanTypeId.set(typeId);
-                        markSynced();
+                        this.appliedStructureId.set(structureId);
+                        markSynced(structureId);
                         return;
                     }
-                }
-                this.isLoadingStructure.set(true);
-                try {
-                    const defaults = await this.loadDefaultsForPlanType(typeId, repeatableSectionTypeIds);
+                    if (!typeId) {
+                        this.appliedPlanTypeId.set(null);
+                        this.appliedStructureId.set(null);
+                        this.applyStructure({ sections: [] }, { asBaseline: true });
+                        markSynced(null);
+                        return;
+                    }
+                    // Plan type alone must not auto-pick a structure or rebuild sections.
+                    if (!structureId) {
+                        this.appliedPlanTypeId.set(typeId);
+                        this.appliedStructureId.set(null);
+                        markSynced(null);
+                        return;
+                    }
+                    const defaults = await this.loadDefaultsForStructure(typeId, structureId, repeatableSectionTypeIds);
                     if (cancelled)
                         return;
-                    // Replace (never append) the current collection with type defaults.
                     this.applyStructure(defaults, { asBaseline: true });
                     this.appliedPlanTypeId.set(typeId);
-                    markSynced();
+                    this.appliedStructureId.set(structureId);
+                    markSynced(structureId);
                 }
                 catch {
                     if (cancelled)
@@ -1491,6 +1584,17 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "#syncFromContext" }] : /* istanbul ignore next */ []));
     }
+    /** Keep builder options stable across rootContext snapshot churn (questionnaire pattern). */
+    #stabilizeBuilderOptions;
+    /**
+     * Plan type changed on the form — clear structure and wait for a manual structure pick.
+     * Does not rebuild sections; structure selection drives the next load.
+     */
+    #detectPlanTypeUserChange;
+    /**
+     * User changed structure after a successful sync — bump token so `#syncFromContext` reloads.
+     */
+    #detectStructureUserChange;
     #syncFromContext;
     onValueChange(value) {
         const withOrder = normalizeSafetyPlanSectionBuilderValue({
@@ -1499,9 +1603,12 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
                 sortOrder: index + 1,
             })),
         });
+        if (isEqual(untracked(() => this.committedValue()), withOrder)) {
+            return;
+        }
         this.committedValue.set(withOrder);
-        this.updateRootContextField('sectionStructure', withOrder);
-        this.updateRootContextField('sections', withOrder);
+        this.persistContextField('sectionStructure', withOrder, 'user');
+        this.persistContextField('sections', withOrder, 'user');
         this.recompute();
     }
     getWizardStepContext() {
@@ -1517,9 +1624,10 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
     }
     async getPrimaryMenuItems() {
         const actions = [];
-        const canPreview = !this.isLoadingStructure() &&
-            (!!this.hasPlanType() || !!this.safetyPlanId() || (this.committedValue()?.sections.length ?? 0) > 0);
-        if (this.isDraftPlan() && !this.isLoadingStructure()) {
+        const loading = this.showStructureLoading();
+        const canPreview = !loading &&
+            (!!this.hasStructure() || !!this.safetyPlanId() || (this.committedValue()?.sections.length ?? 0) > 0);
+        if (this.isDraftPlan() && !loading) {
             actions.push({
                 title: '@workplacesafety-management:safety-plan-sections.entities.safety-plan-section.actions.add-section.title',
                 icon: 'fa-light fa-layer-group',
@@ -1534,23 +1642,14 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
                 title: '@workplacesafety-management:safety-plan-sections.entities.safety-plan-section.actions.preview.title',
                 icon: 'fa-light fa-eye',
                 zone: 'header',
-                priority: 'secondary',
+                priority: 'primary',
                 color: 'default',
                 command: { name: SAFETY_PLAN_SECTIONS_PREVIEW_COMMAND, options: {} },
             });
         }
-        if (!this.isDraftPlan() || this.isLoadingStructure()) {
+        if (!this.isDraftPlan() || loading) {
             return actions;
         }
-        actions.push({
-            title: '@workplacesafety-management:safety-plans.actions.change-plan-type.title',
-            icon: 'fa-light fa-arrow-right-arrow-left',
-            zone: 'header',
-            priority: 'secondary',
-            color: 'default',
-            visible: this.isDraftPlan() && (!!this.planTypeId() || !!this.safetyPlanId()),
-            command: { name: SAFETY_PLAN_SECTIONS_CHANGE_PLAN_TYPE_COMMAND, options: {} },
-        });
         if (this.safetyPlanId()) {
             actions.push({
                 title: '@general:actions.discard.title',
@@ -1581,10 +1680,6 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
             await this.handlePreview();
             return;
         }
-        if (command.name === SAFETY_PLAN_SECTIONS_CHANGE_PLAN_TYPE_COMMAND) {
-            await this.handleChangePlanType();
-            return;
-        }
         if (command.name === SAFETY_PLAN_SECTIONS_DISCARD_COMMAND) {
             this.handleDiscard();
             return;
@@ -1603,186 +1698,6 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
             structure: cloneDeep(this.committedValue() ?? { sections: [] }),
         });
     }
-    async handleChangePlanType() {
-        if (!this.isDraftPlan()) {
-            this.toastService.show({
-                color: 'warning',
-                title: await this.translateService.translateAsync('@general:messages.generic.error.title'),
-                content: await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.draft-only'),
-            });
-            return;
-        }
-        const selection = await this.promptChangePlanTypeDialog();
-        if (!selection) {
-            return;
-        }
-        const currentTypeId = this.planTypeId();
-        if (currentTypeId && currentTypeId === selection.safetyPlanTypeId) {
-            this.toastService.show({
-                color: 'warning',
-                title: await this.translateService.translateAsync('@general:messages.generic.error.title'),
-                content: await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.same-plan-type'),
-            });
-            return;
-        }
-        const confirmed = await this.confirmChangePlanType();
-        if (!confirmed) {
-            return;
-        }
-        const planId = this.safetyPlanId();
-        this.isLoadingStructure.set(true);
-        try {
-            if (planId) {
-                await this.applyPersistedPlanTypeChange(planId, selection);
-            }
-            else {
-                await this.applyWizardPlanTypeChange(selection);
-            }
-        }
-        catch {
-            this.toastService.show({
-                color: 'danger',
-                title: await this.translateService.translateAsync('@general:messages.generic.error.title'),
-                content: await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.change-plan-type-failed'),
-            });
-        }
-        finally {
-            this.isLoadingStructure.set(false);
-        }
-    }
-    async promptChangePlanTypeDialog() {
-        const ctx = this.rootContext() ?? {};
-        const currentType = ctx['safetyPlanType'] ?? {};
-        const currentTypeId = this.planTypeId() ?? '';
-        const result = await this.layoutBuilder
-            .create()
-            .dialog((dialog) => {
-            dialog
-                .setTitle('@workplacesafety-management:safety-plans.actions.change-plan-type.dialog.title')
-                .setSize('md')
-                .setCloseButton(true)
-                .setContext({
-                safetyPlanTypeId: currentTypeId,
-                safetyPlanType: currentTypeId
-                    ? {
-                        id: currentTypeId,
-                        title: typeof currentType.title === 'string' ? currentType.title : undefined,
-                        code: typeof currentType.code === 'string' ? currentType.code : undefined,
-                    }
-                    : undefined,
-            })
-                .content((flex) => {
-                flex
-                    .setDirection('column')
-                    .setGap('12px')
-                    .formField('@workplacesafety-management:safety-plans.actions.change-plan-type.dialog.fields.plan-type.title', (field) => {
-                    field.path('safetyPlanTypeId');
-                    field.lookupBox({
-                        entity: SAFETY_PLAN_TYPE_ENTITY,
-                        look: 'select',
-                        searchable: true,
-                        textField: 'title',
-                        valueField: 'id',
-                        columns: ['code', 'title'],
-                        expose: [
-                            { source: 'id', target: 'safetyPlanType.id' },
-                            { source: 'title', target: 'safetyPlanType.title' },
-                            { source: 'code', target: 'safetyPlanType.code' },
-                        ],
-                        validations: [{ rule: 'required' }],
-                    });
-                });
-            })
-                .setActions((actions) => {
-                actions
-                    .cancel('@general:actions.cancel.title')
-                    .submit('@workplacesafety-management:safety-plans.actions.change-plan-type.dialog.actions.continue');
-            })
-                .onAction(async (dialogRef) => {
-                if (dialogRef.action() === 'cancel') {
-                    return null;
-                }
-                const context = dialogRef.context();
-                const safetyPlanTypeId = resolveEntityRefId(context.safetyPlanTypeId);
-                if (!safetyPlanTypeId) {
-                    throw new Error((await this.translateService.translateAsync('@workplacesafety-management:safety-plans.actions.change-plan-type.dialog.fields.plan-type.placeholder')) || 'Select a Plan Type');
-                }
-                return {
-                    safetyPlanTypeId,
-                    safetyPlanType: context.safetyPlanType?.id
-                        ? context.safetyPlanType
-                        : { id: safetyPlanTypeId },
-                };
-            });
-        })
-            .show();
-        return resolveLayoutBuilderDialogResult(result);
-    }
-    async confirmChangePlanType() {
-        const title = (await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.confirm-change-plan-type.title')) || 'Change Plan Type?';
-        const message = (await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.confirm-change-plan-type.message')) ||
-            'Changing the Plan Type will discard all existing sections and their selected values. The default sections for the new Plan Type will be loaded. Do you want to continue?';
-        const dialogResult = await this.dialogService.confirm(title, message, 'danger', 'horizontal');
-        return dialogResult.result === true;
-    }
-    async applyPersistedPlanTypeChange(planId, selection) {
-        const payload = await this.hooks.runAsync(AXPRuntimeRemoteHookKeys.CommandExecute, {
-            name: AXMWorkplaceSafetyManagementCommandKeys.SafetyPlan.ChangeType,
-            input: {
-                id: planId,
-                safetyPlanTypeId: selection.safetyPlanTypeId,
-                safetyPlanType: selection.safetyPlanType,
-            },
-        });
-        if (!payload.handled || !payload.result?.success) {
-            const text = payload.result?.message?.text;
-            this.toastService.show({
-                color: 'danger',
-                title: await this.translateService.translateAsync('@general:messages.generic.error.title'),
-                content: typeof text === 'string' && text.startsWith('@')
-                    ? await this.translateService.translateAsync(text)
-                    : await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.change-plan-type-failed'),
-            });
-            return;
-        }
-        const data = payload.result.data;
-        const nextTypeId = data?.safetyPlanTypeId ?? selection.safetyPlanTypeId;
-        const nextType = data?.safetyPlanType ?? selection.safetyPlanType ?? { id: nextTypeId };
-        const repeatableSectionTypeIds = await this.loadRepeatableSectionTypeIds();
-        const saved = dedupeSafetyPlanSectionStructure(safetyPlanSectionsToBuilderValue((data?.sections ?? [])), { repeatableSectionTypeIds });
-        this.planTypeOverride.set(nextTypeId);
-        this.updateRootContextField('safetyPlanTypeId', nextTypeId);
-        this.updateRootContextField('safetyPlanType', nextType);
-        this.appliedPlanTypeId.set(nextTypeId);
-        this.lastSyncedKey.set(`${planId}|${nextTypeId}`);
-        this.inflightSyncKey.set(null);
-        this.applyStructure(saved, { asBaseline: true });
-        this.builderRef()?.syncAfterSave(saved);
-        this.recompute();
-        this.toastService.show({
-            color: 'success',
-            title: await this.translateService.translateAsync('@general:messages.generic.success.title'),
-            content: await this.translateService.translateAsync('@workplacesafety-management:safety-plans.actions.change-plan-type.dialog.success'),
-        });
-    }
-    async applyWizardPlanTypeChange(selection) {
-        const repeatableSectionTypeIds = await this.loadRepeatableSectionTypeIds();
-        const defaults = await this.loadDefaultsForPlanType(selection.safetyPlanTypeId, repeatableSectionTypeIds);
-        this.planTypeOverride.set(selection.safetyPlanTypeId);
-        this.updateRootContextField('safetyPlanTypeId', selection.safetyPlanTypeId);
-        this.updateRootContextField('safetyPlanType', selection.safetyPlanType ?? { id: selection.safetyPlanTypeId });
-        this.appliedPlanTypeId.set(selection.safetyPlanTypeId);
-        this.lastSyncedKey.set(`|${selection.safetyPlanTypeId}`);
-        this.inflightSyncKey.set(null);
-        this.applyStructure(defaults, { asBaseline: true });
-        this.builderRef()?.syncAfterSave(defaults);
-        this.recompute();
-        this.toastService.show({
-            color: 'success',
-            title: await this.translateService.translateAsync('@general:messages.generic.success.title'),
-            content: await this.translateService.translateAsync('@workplacesafety-management:safety-plans.actions.change-plan-type.dialog.success'),
-        });
-    }
     async handleSave(options) {
         const silent = options?.silent === true;
         const id = this.safetyPlanId();
@@ -1803,7 +1718,7 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
             const repeatableSectionTypeIds = await this.loadRepeatableSectionTypeIds();
             const saved = await this.fetchSectionsFromBackend(id, repeatableSectionTypeIds);
             this.applyStructure(saved, { asBaseline: true });
-            this.lastSyncedKey.set(`${id}|${this.planTypeId() ?? ''}`);
+            this.lastSyncedKey.set(this.buildSyncKey(id, this.planTypeId(), this.structureId()));
             this.inflightSyncKey.set(null);
             this.builderRef()?.syncAfterSave(saved);
             this.recompute();
@@ -1842,16 +1757,37 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
         if (options.asBaseline) {
             this.baselineValue.set(normalized);
         }
-        this.committedValue.set(normalized);
-        // Keep both form fields in sync with the same replaced value (never merge/append).
-        this.updateRootContextField('sectionStructure', normalized);
-        this.updateRootContextField('sections', normalized);
-        // Defer host recompute so it cannot re-enter the sync effect synchronously.
-        queueMicrotask(() => {
-            untracked(() => this.recompute());
-        });
+        if (!isEqual(untracked(() => this.committedValue()), normalized)) {
+            this.committedValue.set(normalized);
+        }
+        // Mirror onto the current rootContext object only (no contextStore.update).
+        // Store writes during load re-snapshot rootContext and remount/lazy-reload the page.
+        this.mirrorRootContextField('sectionStructure', normalized);
+        this.mirrorRootContextField('sections', normalized);
+    }
+    buildSyncKey(planId, typeId, structureId) {
+        return `${planId ?? ''}|${typeId ?? ''}|${structureId ?? ''}`;
+    }
+    /** Mutate the current rootContext input object without notifying the context store. */
+    mirrorRootContextField(field, value) {
+        const ctx = this.rootContext();
+        if (!ctx || typeof ctx !== 'object') {
+            return;
+        }
+        ctx[field] = cloneDeep(value);
+    }
+    /**
+     * User edits / explicit plan-type changes: write through AXPContextStore (skips when equal)
+     * and mirror onto the current rootContext input object.
+     */
+    persistContextField(field, value, origin) {
+        this.contextStore.update(field, cloneDeep(value), { origin });
+        this.mirrorRootContextField(field, value);
+    }
+    updateRootContextField(field, value) {
+        // Prefer store writes for explicit field updates (plan type / structure / discard).
+        this.persistContextField(field, value, 'system');
     }
-    /** Query plan sections from storage and return a deduped builder value (replace, never append). */
     async fetchSectionsFromBackend(planId, repeatableSectionTypeIds = []) {
         const result = await this.entityService.withEntity(SAFETY_PLAN_SECTION_ENTITY).data().query({
             skip: 0,
@@ -1994,7 +1930,7 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
             return builtIn;
         }
     }
-    async loadDefaultsForPlanType(typeId, repeatableSectionTypeIds = []) {
+    async queryTypeSectionsForPlanType(typeId) {
         const result = await this.entityService.withEntity(SAFETY_PLAN_TYPE_SECTION_ENTITY).data().query({
             skip: 0,
             take: 1000,
@@ -2007,8 +1943,15 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
                 ],
             },
         });
-        const typeSections = (result.items ?? []).filter((row) => resolveEntityRefId(row.safetyPlanTypeId) === typeId);
-        const structure = dedupeSafetyPlanSectionStructure(buildSectionStructureFromTypeSections(typeSections, {
+        return (result.items ?? []).filter((row) => resolveEntityRefId(row.safetyPlanTypeId) === typeId);
+    }
+    async loadDefaultsForStructure(typeId, structureId, repeatableSectionTypeIds = []) {
+        if (!typeId) {
+            return { sections: [] };
+        }
+        const typeSections = await this.queryTypeSectionsForPlanType(typeId);
+        const sourceRows = pickSafetyPlanTypeSectionsForStructure(typeSections, structureId);
+        const structure = dedupeSafetyPlanSectionStructure(buildSectionStructureFromTypeSections(sourceRows, {
             createId: () => AXPDataGenerator.uuid(),
         }), { repeatableSectionTypeIds });
         return toBuilderValueFromStructure(await this.enrichSectionTitlesFromSectionTypes(structure));
@@ -2071,13 +2014,6 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
             }),
         };
     }
-    async confirmReplaceStructure() {
-        const title = (await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.confirm-change-plan-type.title')) || 'Change Plan Type?';
-        const message = (await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.confirm-change-plan-type.message')) ||
-            'Changing the Plan Type will discard all existing sections and their selected values. The default sections for the new Plan Type will be loaded. Do you want to continue?';
-        const dialogResult = await this.dialogService.confirm(title, message, 'danger', 'horizontal');
-        return dialogResult.result === true;
-    }
     async showStructureLoadError() {
         this.toastService.show({
             color: 'danger',
@@ -2085,13 +2021,6 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
             content: await this.translateService.translateAsync('@workplacesafety-management:safety-plans.messages.section-structure.load-failed'),
         });
     }
-    updateRootContextField(field, value) {
-        const ctx = this.rootContext();
-        if (!ctx || typeof ctx !== 'object') {
-            return;
-        }
-        ctx[field] = cloneDeep(value);
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanSectionsPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXMSafetyPlanSectionsPageComponent, isStandalone: true, selector: "axm-safety-plan-sections-page", inputs: { rootContext: { classPropertyName: "rootContext", publicName: "rootContext", isSignal: true, isRequired: false, transformFunction: null }, pageConfig: { classPropertyName: "pageConfig", publicName: "pageConfig", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block w-full min-h-0" }, providers: [
             {
@@ -2099,23 +2028,29 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
                 useExisting: AXMSafetyPlanSectionsPageComponent,
             },
         ], viewQueries: [{ propertyName: "builderRef", first: true, predicate: ["builderRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
-    @if (isLoadingStructure()) {
-      <p class="text-muted p-4">
-        {{
-          '@workplacesafety-management:safety-plans.entities.safety-plan.pages.sections.loading'
-            | translate
-            | async
-        }}
-      </p>
-    } @else if (safetyPlanId() || hasPlanType()) {
-      <axm-safety-plan-section-builder
-        #builderRef
-        [value]="committedValue()"
-        [safetyPlanId]="safetyPlanId() ?? undefined"
-        [options]="builderOptions()"
-        (valueChange)="onValueChange($event)"
-      />
-    } @else {
+    @if (safetyPlanId() || hasStructure()) {
+      <div class="relative block w-full min-h-0">
+        <!-- ----- Skeleton overlay while structure loads (builder stays mounted) ----- -->
+        @if (showStructureLoading()) {
+          <div class="flex flex-col gap-3 p-4 absolute inset-0 z-10 bg-white/80 dark:bg-black/40">
+            <ax-skeleton [animated]="true" class="h-5 w-2/5 rounded-md"></ax-skeleton>
+            <ax-skeleton [animated]="true" class="h-24 w-full rounded-md"></ax-skeleton>
+            <ax-skeleton [animated]="true" class="h-24 w-full rounded-md"></ax-skeleton>
+            <ax-skeleton [animated]="true" class="h-4 w-3/5 rounded-md"></ax-skeleton>
+          </div>
+        }
+        <!-- ----- Sections builder — mounted once structure is known (or editing an existing plan) ----- -->
+        <axm-safety-plan-section-builder
+          #builderRef
+          [value]="committedValue()"
+          [safetyPlanId]="safetyPlanId() ?? undefined"
+          [options]="builderOptions()"
+          (valueChange)="onValueChange($event)"
+        />
+      </div>
+    }
+    <!-- ----- Prompt to select plan type + structure before sections can load ----- -->
+    @else {
       <p class="text-muted p-4">
         {{
           '@workplacesafety-management:safety-plans.entities.safety-plan.pages.sections.select-plan-type-first'
@@ -2124,32 +2059,38 @@ class AXMSafetyPlanSectionsPageComponent extends AXPPageLayoutBaseComponent {
         }}
       </p>
     }
-  `, isInline: true, dependencies: [{ kind: "component", type: AXMSafetyPlanSectionBuilderComponent, selector: "axm-safety-plan-section-builder", inputs: ["value", "safetyPlanId", "options"], outputs: ["valueChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "pipe", type: i1$1.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: AXMSafetyPlanSectionBuilderComponent, selector: "axm-safety-plan-section-builder", inputs: ["value", "safetyPlanId", "options"], outputs: ["valueChange"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXSkeletonModule }, { kind: "component", type: i1$1.AXSkeletonComponent, selector: "ax-skeleton", inputs: ["animated"] }, { kind: "pipe", type: i2$1.AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXMSafetyPlanSectionsPageComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'axm-safety-plan-sections-page',
                     standalone: true,
-                    imports: [AXMSafetyPlanSectionBuilderComponent, AXTranslationModule, AsyncPipe],
+                    imports: [AXMSafetyPlanSectionBuilderComponent, AXTranslationModule, AsyncPipe, AXSkeletonModule],
                     template: `
-    @if (isLoadingStructure()) {
-      <p class="text-muted p-4">
-        {{
-          '@workplacesafety-management:safety-plans.entities.safety-plan.pages.sections.loading'
-            | translate
-            | async
-        }}
-      </p>
-    } @else if (safetyPlanId() || hasPlanType()) {
-      <axm-safety-plan-section-builder
-        #builderRef
-        [value]="committedValue()"
-        [safetyPlanId]="safetyPlanId() ?? undefined"
-        [options]="builderOptions()"
-        (valueChange)="onValueChange($event)"
-      />
-    } @else {
+    @if (safetyPlanId() || hasStructure()) {
+      <div class="relative block w-full min-h-0">
+        <!-- ----- Skeleton overlay while structure loads (builder stays mounted) ----- -->
+        @if (showStructureLoading()) {
+          <div class="flex flex-col gap-3 p-4 absolute inset-0 z-10 bg-white/80 dark:bg-black/40">
+            <ax-skeleton [animated]="true" class="h-5 w-2/5 rounded-md"></ax-skeleton>
+            <ax-skeleton [animated]="true" class="h-24 w-full rounded-md"></ax-skeleton>
+            <ax-skeleton [animated]="true" class="h-24 w-full rounded-md"></ax-skeleton>
+            <ax-skeleton [animated]="true" class="h-4 w-3/5 rounded-md"></ax-skeleton>
+          </div>
+        }
+        <!-- ----- Sections builder — mounted once structure is known (or editing an existing plan) ----- -->
+        <axm-safety-plan-section-builder
+          #builderRef
+          [value]="committedValue()"
+          [safetyPlanId]="safetyPlanId() ?? undefined"
+          [options]="builderOptions()"
+          (valueChange)="onValueChange($event)"
+        />
+      </div>
+    }
+    <!-- ----- Prompt to select plan type + structure before sections can load ----- -->
+    @else {
       <p class="text-muted p-4">
         {{
           '@workplacesafety-management:safety-plans.entities.safety-plan.pages.sections.select-plan-type-first'
@@ -2196,4 +2137,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         }] });
 
 export { AXMSafetyPlanSectionBuilderComponent, AXMSafetyPlanSectionsPageComponent, AXMSafetyPlanSectionsPageComponentProvider, SAFETY_PLAN_SECTIONS_SAVE_COMMAND };
-//# sourceMappingURL=acorex-platform-module-workplacesafety-management-client-index-LxP1eZLY.mjs.map
+//# sourceMappingURL=acorex-platform-module-workplacesafety-management-client-index-gbDgxqrV.mjs.map