>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3586589. --> Reported by: [bnjmnm](https://www.drupal.org/user/2369194) Related to !981 !973 !985 !987 >>> <h3>Reported Concern</h3> <p>Changes are not reflected in real time and require pressing enter to take effect (changes are lost if I close modal without pressing enter)</p> <h3 id="overview">Overview</h3> <h4>1. Persistence &amp; Real-time Updates</h4> <ul> <li><strong>UI Parity:</strong> Multi-value fields must behave consistently with SingleValue fields.</li> <li><strong>Propagation:</strong> Changes must reflect instantly in both the right-hand configuration panel and the page preview/prop text as the user interacts with the field.</li> <li><strong>Auto-save:</strong> Updates should trigger an auto-save/persistence action immediately upon change (similar to the SingleValue implementation) rather than requiring an explicit "Enter" or "Save" click to commit the data.</li> </ul> <h4>2. Popover Behavior</h4> <ul> <li><strong>Closing Mechanism:</strong> The popover dialog must close automatically when: <ul> <li>The user presses the <strong>Enter</strong> key.</li> <li>The user clicks anywhere outside the popover boundaries (outside click).</li> </ul> </li> <li><strong>Save on Close:</strong> Closing the dialog via an outside click must still persist the current value.</li> </ul> <h4>3. Validation</h4> <ul> <li><strong>Validation Timing:</strong> Validation should not be restricted to the "Enter" key press. It must follow the existing SingleValue field implementation (e.g., validation on blur or keystroke as per standard platform behavior).</li> </ul> <h4>4. Revert/Undo Mechanism</h4> <ul> <li><strong>Keyboard Shortcuts:</strong> Since updates are real-time, users must be able to revert changes using standard keyboard shortcuts: <code>CTRL+Z</code> (Windows) or <code>CMD+Z</code> (Mac).</li> <li><em>Note: A separate ticket should be created to track the specific implementation of the undo logic if not already present in the core framework.</em></li> </ul> <h3 id="proposed-resolution">Proposed resolution</h3> <h3 id="ui-changes">User interface changes</h3>