/* ========================================================================
   ParalleloField — React wrapper around the Parallelo field generator
   (design-system component API). Engine lives in assets/parallelo.js
   (window.Parallelo). Renders a <div> and fills it with an auto-resizing
   SVG lattice; re-paints when props change. Registered on window so the
   Babel page scripts can consume it as <ParalleloField .../>.
   ======================================================================== */
function ParalleloField(props) {
  const ref = React.useRef(null);
  const { className, style, ...rest } = props;

  const FILL_KEYS = [
    'preset', 'unit', 'slope', 'depth',
    'line', 'lineWidth', 'background', 'bleed', 'offsetX', 'offsetY',
  ];

  const opts = {};
  for (const k of FILL_KEYS) if (rest[k] !== undefined && rest[k] !== null) opts[k] = rest[k];
  const dep = JSON.stringify(opts);

  React.useEffect(() => {
    const el = ref.current;
    if (!el) return;
    if (typeof window === 'undefined' || !window.Parallelo) {
      console.warn('[ParalleloField] window.Parallelo is not loaded. Load assets/parallelo.js.');
      return;
    }
    if (el.__parallelo && typeof el.__parallelo.disconnect === 'function') el.__parallelo.disconnect();
    window.Parallelo.fill(el, opts);
    return () => {
      if (el.__parallelo && typeof el.__parallelo.disconnect === 'function') el.__parallelo.disconnect();
    };
  }, [dep]);

  return React.createElement('div', { ref, className, style });
}

Object.assign(window, { ParalleloField });

/* LandingParallelo — the neutral bottom band used on the Search,
   Opportunities, and Worksheets landing pages. Rendered as a direct
   child of <div className="body">; CSS (.parallelo-band) pins it to the
   bottom, full width, behind the columns. */
function LandingParallelo() {
  return React.createElement(ParalleloField, {
    className: 'parallelo-band',
    line: 'rgba(20,20,23,0.09)',
    background: null,
    unit: 108,
    lineWidth: 1,
  });
}

Object.assign(window, { LandingParallelo });

