// Shared Lucide icon helper for the website UI kit pages.
// Lucide is loaded globally via <script src="https://unpkg.com/lucide">.
function LucideIcon({ name, size = 22, color }) {
  const ref = React.useRef(null);
  React.useEffect(() => {
    if (ref.current && window.lucide && window.lucide.icons[name]) {
      ref.current.innerHTML = '';
      const svg = window.lucide.createElement(window.lucide.icons[name]);
      svg.setAttribute('width', size);
      svg.setAttribute('height', size);
      if (color) svg.setAttribute('stroke', color);
      ref.current.appendChild(svg);
    }
  }, [name, size, color]);
  return React.createElement('span', { ref, style: { width: size, height: size, display: 'inline-flex' } });
}

window.LucideIcon = LucideIcon;