Clarify request mapping UI

apps/ui/js/wizard-mapping.js

@@ -346,6 +346,25 @@
     return button;
   }
 
+  function wrapMappingControl(labelText, control) {
+    var wrapper = document.createElement('label');
+    wrapper.className = 'mapping-field';
+    var label = document.createElement('span');
+    label.className = 'mapping-field-label';
+    label.textContent = labelText;
+    wrapper.appendChild(label);
+    wrapper.appendChild(control);
+    return wrapper;
+  }
+
+  function makeMappingArrow() {
+    var arrow = document.createElement('span');
+    arrow.className = 'mapping-arrow';
+    arrow.setAttribute('aria-hidden', 'true');
+    arrow.textContent = '→';
+    return arrow;
+  }
+
   function renderRequestRows(rows) {
     var root = field('wizard-request-mapping-rows');
     if (!root) return;
@@ -364,7 +383,10 @@
 
     var input = makeInput(row.input, 'form-input input-mono mapping-source', 'base');
     input.dataset.role = 'input';
-    item.appendChild(input);
+    input.title = 'Поле, которое MCP клиент передает инструменту';
+    item.appendChild(wrapMappingControl('Из инструмента', input));
+
+    item.appendChild(makeMappingArrow());
 
     var select = document.createElement('select');
     select.className = 'form-select mapping-target';
@@ -378,16 +400,17 @@
       select.appendChild(makeOption(entry[0], entry[1], entry[0] === row.target));
     });
     select.addEventListener('change', syncVisualMappingsToYaml);
-    item.appendChild(select);
+    item.appendChild(wrapMappingControl('Куда в API', select));
 
     var apiName = makeInput(row.apiName || row.input, 'form-input input-mono mapping-api-name', 'base');
     apiName.dataset.role = 'apiName';
-    item.appendChild(apiName);
+    apiName.title = 'Имя path, query, header или body-поля в API-запросе';
+    item.appendChild(wrapMappingControl('Имя в API', apiName));
 
-    var defaultValue = makeInput(row.defaultValue, 'form-input input-mono mapping-default-value', 'по умолчанию');
+    var defaultValue = makeInput(row.defaultValue, 'form-input input-mono mapping-default-value', 'если не передано');
     defaultValue.dataset.role = 'defaultValue';
-    defaultValue.title = 'Значение по умолчанию, если поле не передано';
-    item.appendChild(defaultValue);
+    defaultValue.title = 'Необязательно. Это значение уйдет в API, если агент не передал поле инструмента.';
+    item.appendChild(wrapMappingControl('Если пусто', defaultValue));
 
     var transform = document.createElement('select');
     transform.className = 'form-select mapping-transform';
@@ -398,7 +421,7 @@
     });
     transform.title = 'Простое преобразование перед отправкой в API';
     transform.addEventListener('change', syncVisualMappingsToYaml);
-    item.appendChild(transform);
+    item.appendChild(wrapMappingControl('Преобразование', transform));
 
     item.appendChild(makeRemoveButton(item));
     return item;
@@ -422,11 +445,15 @@
 
     var responsePath = makeInput(row.responsePath, 'form-input input-mono mapping-response-path', 'rates.EUR');
     responsePath.dataset.role = 'responsePath';
-    item.appendChild(responsePath);
+    responsePath.title = 'Поле из ответа API';
+    item.appendChild(wrapMappingControl('Из ответа API', responsePath));
+
+    item.appendChild(makeMappingArrow());
 
     var output = makeInput(row.output, 'form-input input-mono mapping-output-field', 'rate');
     output.dataset.role = 'output';
-    item.appendChild(output);
+    output.title = 'Поле результата, которое получит MCP клиент';
+    item.appendChild(wrapMappingControl('В результат инструмента', output));
     item.appendChild(makeRemoveButton(item));
     return item;
   }