@valtimo/process-management 13.52.0 → 13.53.0

package/fesm2022/valtimo-process-management.mjs

@@ -1500,7 +1500,12 @@ class ExpressionAutocomplete {
         this.stylesInjected = false;
         this.observer = null;
         this.documentClickHandlers = [];
+        this.selectedElementId = null;
+        this.manualModeKeys = new Set();
         this.injectStyles();
+        eventBus.on('selection.changed', (event) => {
+            this.selectedElementId = event?.newSelection?.[0]?.id ?? null;
+        });
         eventBus.on('diagram.destroy', () => {
             this.dispose();
         });
@@ -1512,6 +1517,7 @@ class ExpressionAutocomplete {
             this.observer = null;
         }
         this.panelContainer = null;
+        this.manualModeKeys.clear();
     }
     cleanupClickHandlers() {
         for (const handler of this.documentClickHandlers) {
@@ -1553,7 +1559,8 @@ class ExpressionAutocomplete {
     }
     isExpressionField(input) {
         const type = input.type?.toLowerCase();
-        if (input.tagName !== 'TEXTAREA' && !(input.tagName === 'INPUT' && (!type || type === 'text'))) {
+        if (input.tagName !== 'TEXTAREA' &&
+            !(input.tagName === 'INPUT' && (!type || type === 'text'))) {
             return false;
         }
         if (input.closest('.expression-editor-simple')) {
@@ -1597,7 +1604,7 @@ class ExpressionAutocomplete {
         wrapper.className = 'expression-editor-wrapper';
         const parsed = this.parseExpression(input.value);
         const canUseDropdown = !input.value || (parsed.beanName !== null && parsed.methodName !== null);
-        const initialMode = canUseDropdown ? 'simple' : 'technical';
+        const initialMode = canUseDropdown && !this.manualModeKeys.has(this.getModeKey(input)) ? 'simple' : 'technical';
         wrapper.dataset.mode = initialMode;
         input.parentNode?.insertBefore(wrapper, input);
         const toggle = document.createElement('div');
@@ -1628,6 +1635,13 @@ class ExpressionAutocomplete {
     }
     setEditorMode(wrapper, input, mode) {
         wrapper.dataset.mode = mode;
+        const modeKey = this.getModeKey(input);
+        if (mode === 'technical') {
+            this.manualModeKeys.add(modeKey);
+        }
+        else {
+            this.manualModeKeys.delete(modeKey);
+        }
         wrapper.querySelectorAll('.expression-editor-toggle__btn').forEach(btn => {
             btn.classList.toggle('active', btn.dataset.mode === mode);
         });
@@ -1660,6 +1674,11 @@ class ExpressionAutocomplete {
             setTimeout(() => input.blur(), 0);
         }
     }
+    // Panel re-renders on save; key survives new input elements
+    getModeKey(input) {
+        const entryId = input.closest('.bio-properties-panel-entry')?.getAttribute('data-entry-id') || '';
+        return `${this.selectedElementId}|${entryId}|${input.name || input.id}`;
+    }
     renderSimpleMode(container, input) {
         this.cleanupClickHandlers();
         const parsed = this.parseExpression(input.value);
@@ -1845,14 +1864,37 @@ class ExpressionAutocomplete {
     }
     parseExpression(expr) {
         const match = expr.match(/^\$\{([a-zA-Z_]\w*)\.([a-zA-Z_]\w*)\((.*)\)\}$/);
-        if (!match)
+        if (!match || !this.isSingleCallArguments(match[3])) {
             return { beanName: null, methodName: null, parameters: [] };
+        }
         return {
             beanName: match[1],
             methodName: match[2],
             parameters: this.parseParameters(match[3]),
         };
     }
+    // Chained calls like `a.b(x).c()` close the first call early
+    isSingleCallArguments(paramsStr) {
+        let depth = 0;
+        let inString = false;
+        let stringChar = '';
+        for (const char of paramsStr) {
+            if (!inString && (char === '"' || char === "'")) {
+                inString = true;
+                stringChar = char;
+            }
+            else if (inString && char === stringChar) {
+                inString = false;
+            }
+            else if (!inString && char === '(') {
+                depth++;
+            }
+            else if (!inString && char === ')' && --depth < 0) {
+                return false;
+            }
+        }
+        return depth === 0;
+    }
     parseParameters(paramsStr) {
         const params = [];
         let current = '';
@@ -1903,9 +1945,7 @@ class ExpressionAutocomplete {
             .replace(/>/g, '&gt;');
     }
     camelCaseToReadable(text) {
-        return text
-            .replace(/([a-z])([A-Z])/g, '$1 $2')
-            .replace(/^./, str => str.toUpperCase());
+        return text.replace(/([a-z])([A-Z])/g, '$1 $2').replace(/^./, str => str.toUpperCase());
     }
     injectStyles() {
         if (this.stylesInjected)