// MyAirSpace UI kits — shared Lucide icon helper.
// SUBSTITUTION: no icon set was supplied with the brief, so MyAirSpace adopts Lucide
// (calm, 2px humanist stroke — matches the soft, rounded brand). Documented in readme ICONOGRAPHY.
function Icon({ name, size = 20, color = "currentColor", strokeWidth = 2, style }) {
  const ref = React.useRef(null);
  React.useEffect(() => {
    if (window.lucide && ref.current) {
      ref.current.innerHTML = "";
      const i = document.createElement("i");
      i.setAttribute("data-lucide", name);
      ref.current.appendChild(i);
      window.lucide.createIcons({
        attrs: { width: size, height: size, "stroke-width": strokeWidth, stroke: color },
      });
    }
  }, [name, size, color, strokeWidth]);
  return (
    <span ref={ref} style={{ display: "inline-flex", alignItems: "center", justifyContent: "center", width: size, height: size, color, flex: "none", ...style }} />
  );
}
window.MyAirSpaceIcon = Icon;