// PumpingStation editor — hover-coupling between side-panel input rows
// and the SVG markers they control. Each .ps-row that carries
// data-couples-line="<svg-element-id>" highlights that SVG line on
// mouseenter and clears the highlight on mouseleave.

(function () {
  const ns = window.PSEditor = window.PSEditor || {};

  ns.hoverCouple = {
    init() {
      document.querySelectorAll('.ps-diag-side .ps-row[data-couples-line]').forEach((row) => {
        const targetId = row.getAttribute('data-couples-line');
        const target = document.getElementById(targetId);
        if (!target) return;
        const enter = () => target.classList.add('ps-line-highlight');
        const leave = () => target.classList.remove('ps-line-highlight');
        row.addEventListener('mouseenter', enter);
        row.addEventListener('mouseleave', leave);
        // Also highlight while the input inside the row has focus, so
        // the user keeps the visual feedback while typing.
        const input = row.querySelector('input');
        if (input) {
          input.addEventListener('focus', enter);
          input.addEventListener('blur', leave);
        }
      });
    },
  };
})();