@myrmidon/gve-core 6.1.0 → 6.1.1

package/fesm2022/myrmidon-gve-core.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { input, output, ChangeDetectionStrategy, Component, inject, DestroyRef, signal, computed, effect, viewChild, model, Injectable, untracked, Optional, Inject, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { input, output, ChangeDetectionStrategy, Component, inject, DestroyRef, signal, computed, effect, viewChild, model, untracked, Injectable, Optional, Inject, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import * as i1 from '@angular/material/core';
 import { MatRippleModule } from '@angular/material/core';
 import * as i2$1 from '@myrmidon/ngx-tools';
@@ -16,8 +16,8 @@ import * as i5 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import * as i6 from '@angular/material/tooltip';
 import { MatTooltipModule, MatTooltip } from '@angular/material/tooltip';
-import { Subject, debounceTime, distinctUntilChanged, startWith, catchError, BehaviorSubject } from 'rxjs';
-import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
+import { Subject, debounceTime, distinctUntilChanged, catchError, BehaviorSubject } from 'rxjs';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i2$3 from '@angular/material/snack-bar';
 import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
 import * as i2$2 from '@angular/cdk/clipboard';
@@ -669,7 +669,28 @@ class FeatureEditorComponent {
          * Event emitted when the user cancels the feature editing.
          */
         this.featureCancel = output();
+        /**
+         * The allowed value IDs for the currently selected feature name.
+         * Set synchronously in updateForm (on feature load) and in the
+         * name.valueChanges subscription (on user interaction).
+         */
         this.nameIds = signal(undefined, ...(ngDevMode ? [{ debugName: "nameIds" }] : []));
+        /**
+         * Tracks the current feature name. Updated synchronously in updateForm
+         * and in the name.valueChanges subscription so that isMultiValued stays
+         * in sync regardless of whether the change was programmatic or user-driven.
+         */
+        this._currentName = signal('', ...(ngDevMode ? [{ debugName: "_currentName" }] : []));
+        /**
+         * Computed signal that determines if the current feature is multi-valued.
+         * Automatically updates when either _currentName or multiValuedFeatureIds
+         * changes.
+         */
+        this.isMultiValued = computed(() => {
+            const ids = this.multiValuedFeatureIds();
+            const name = this._currentName();
+            return !!ids && !!name && ids.includes(name);
+        }, ...(ngDevMode ? [{ debugName: "isMultiValued" }] : []));
         this.name = formBuilder.control('', {
             validators: [Validators.required, Validators.maxLength(50)],
             nonNullable: true,
@@ -696,41 +717,29 @@ class FeatureEditorComponent {
             isGlobal: this.isGlobal,
             isShortLived: this.isShortLived,
         });
-        // Convert name form control valueChanges to a signal for reactive updates
-        this.nameSignal = toSignal(this.name.valueChanges.pipe(startWith('')), {
-            initialValue: '',
-        });
-        // Computed signal that automatically tracks dependencies and triggers
-        // change detection when either name or multiValuedFeatureIds changes
-        this.isMultiValued = computed(() => {
-            const ids = this.multiValuedFeatureIds();
-            const name = this.nameSignal();
-            return !!ids && !!name && ids.includes(name);
-        }, ...(ngDevMode ? [{ debugName: "isMultiValued" }] : []));
-        // when feature changes, update the form
+        // When the feature input changes, repopulate the form atomically.
+        // featValues is read via untracked() so changes to it do not retrigger
+        // this effect and accidentally overwrite in-progress user edits.
         effect(() => {
             this.updateForm(this.feature());
-            setTimeout(() => {
-                this.nameControl()?.nativeElement?.focus();
-                this.nameIds.set(this.getLabeledIdsFor(this.name.value, this.featValues()));
-            }, 500);
-        });
-        // diagnostic logging for multiValuedFeatureIds
-        effect(() => {
-            console.log('[FeatureEditor] multiValuedFeatureIds:', this.multiValuedFeatureIds(), 'isMultiValued:', this.isMultiValued());
+            setTimeout(() => this.nameControl()?.nativeElement?.focus(), 0);
         });
     }
     ngOnInit() {
-        // whenever the name changes, update the value selection
+        // Respond to user-initiated name changes only.
+        // updateForm uses { emitEvent: false } so programmatic loads never
+        // reach this subscription, eliminating the race that caused value.reset()
+        // to fire after a 300 ms debounce and wipe the just-loaded value.
         this._sub = this.name.valueChanges
             .pipe(debounceTime(300), distinctUntilChanged())
             .subscribe((name) => {
-            if (!this._frozen && this.featNames()?.length) {
+            this._currentName.set(name);
+            this.nameIds.set(this.getLabeledIdsFor(name, this.featValues()));
+            // Reset value only when preset names are in use; for free-text names
+            // the value is independent and must not be cleared.
+            if (this.featNames()?.length) {
                 this.value.reset();
-                this.nameIds.set(this.getLabeledIdsFor(name, this.featValues()));
             }
-            // Note: isMultiValued is now a computed signal that automatically
-            // updates when nameSignal or multiValuedFeatureIds changes
         });
     }
     ngOnDestroy() {
@@ -740,26 +749,32 @@ class FeatureEditorComponent {
         if (!id) {
             return undefined;
         }
-        console.log('getLabeledIdsFor', id, featValues);
         return featValues ? featValues[id] : undefined;
     }
     updateForm(feature) {
         if (!feature) {
+            this._currentName.set('');
+            this.nameIds.set(undefined);
             this.form.reset();
-            // Note: isMultiValued is a computed signal - it will automatically
-            // update to false when name is reset to empty string
         }
         else {
-            this._frozen = true;
-            this.name.setValue(feature.name);
-            this.value.setValue(feature.value);
+            // Read featValues outside the reactive context so that changes to
+            // featValues alone do not re-trigger the parent effect and overwrite
+            // any in-progress user edits.
+            const featValues = untracked(() => this.featValues());
+            // Update derived signals first so the template can resolve the correct
+            // control type (select vs text) before Angular renders.
+            this._currentName.set(feature.name);
+            this.nameIds.set(this.getLabeledIdsFor(feature.name, featValues));
+            // Use emitEvent: false to suppress valueChanges events.
+            // This prevents the name.valueChanges subscription (which resets the
+            // value control) from firing during a programmatic load.
+            this.name.setValue(feature.name, { emitEvent: false });
+            this.value.setValue(feature.value, { emitEvent: false });
             this.setPolicy.setValue(feature.setPolicy || FeatureSetPolicy.multiple);
             this.isNegated.setValue(feature.isNegated || false);
             this.isGlobal.setValue(feature.isGlobal || false);
             this.isShortLived.setValue(feature.isShortLived || false);
-            // Note: isMultiValued is a computed signal - it will automatically
-            // update based on the new name value and multiValuedFeatureIds
-            this._frozen = false;
         }
     }
     addValueToComposite() {
@@ -887,10 +902,6 @@ class FeatureSetEditorComponent {
         effect(() => {
             this.applyFeatureFilter(this.features(), this.filter.value);
         });
-        // diagnostic logging for multiValuedFeatureIds
-        effect(() => {
-            console.log('[FeatureSetEditor] multiValuedFeatureIds:', this.multiValuedFeatureIds());
-        });
     }
     applyFeatureFilter(features, name) {
         this.filteredFeatures.set(features.filter((feature) => {