// 1.5px stroke line icons, per brand. White-on-purple capable.
const Icon = ({ name, size = 16, color = "currentColor", strokeWidth = 1.5, className = "" }) => {
  const paths = {
    search: <><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></>,
    inbox: <><path d="M3 13v6a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-6"/><path d="m3 13 3-8h12l3 8"/><path d="M3 13h5l1.5 3h5L16 13h5"/></>,
    user: <><circle cx="12" cy="8" r="4"/><path d="M4 21c0-4.4 3.6-8 8-8s8 3.6 8 8"/></>,
    users: <><circle cx="9" cy="8" r="3.5"/><path d="M3 20c0-3.3 2.7-6 6-6s6 2.7 6 6"/><path d="M17 4.5a3.5 3.5 0 0 1 0 7"/><path d="M21 20c0-2.6-1.7-4.8-4-5.7"/></>,
    bolt: <path d="M13 2 4 14h7l-1 8 9-12h-7l1-8Z"/>,
    shield: <><path d="M12 3 4 6v6c0 5 3.4 8.6 8 9 4.6-.4 8-4 8-9V6l-8-3Z"/></>,
    lock: <><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></>,
    unlock: <><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 7.5-2"/></>,
    key: <><circle cx="8" cy="15" r="4"/><path d="m10.5 12 9-9 2 2-2 2 2 2-3 3-2-2-3 3"/></>,
    device: <><rect x="3" y="4" width="18" height="12" rx="2"/><path d="M8 20h8M10 16v4M14 16v4"/></>,
    phone: <><rect x="7" y="2" width="10" height="20" rx="2"/><path d="M11 18h2"/></>,
    printer: <><path d="M6 9V3h12v6"/><rect x="3" y="9" width="18" height="8" rx="2"/><rect x="7" y="14" width="10" height="7"/></>,
    wifi: <><path d="M2 9c6-5 14-5 20 0"/><path d="M5 12c4-3.5 10-3.5 14 0"/><path d="M8.5 15c2-1.8 5-1.8 7 0"/><circle cx="12" cy="18.5" r="1" fill={color}/></>,
    activity: <><path d="M3 12h4l3-8 4 16 3-8h4"/></>,
    check: <path d="m4 12 5 5L20 6"/>,
    x: <path d="M5 5 19 19M19 5 5 19"/>,
    arrow: <><path d="M4 12h16"/><path d="m14 6 6 6-6 6"/></>,
    chevron: <path d="m9 6 6 6-6 6"/>,
    chevronDown: <path d="m6 9 6 6 6-6"/>,
    ellipsis: <><circle cx="5" cy="12" r="1" fill={color}/><circle cx="12" cy="12" r="1" fill={color}/><circle cx="19" cy="12" r="1" fill={color}/></>,
    settings: <><circle cx="12" cy="12" r="3"/><path d="M12 2v3M12 19v3M2 12h3M19 12h3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M4.9 19.1 7 17M17 7l2.1-2.1"/></>,
    sparkle: <><path d="M12 3v18M3 12h18M5.5 5.5 18.5 18.5M18.5 5.5 5.5 18.5" strokeWidth="1"/></>,
    violet: <><path d="M12 2 6 14a6 6 0 0 0 12 0L12 2Z"/><circle cx="12" cy="15" r="2" fill={color}/></>,
    pause: <><rect x="6" y="5" width="4" height="14" rx="1"/><rect x="14" y="5" width="4" height="14" rx="1"/></>,
    play: <path d="M7 4v16l13-8L7 4Z"/>,
    clock: <><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></>,
    info: <><circle cx="12" cy="12" r="9"/><path d="M12 8h.01M11 12h1v5h1"/></>,
    alert: <><path d="M12 3 2 20h20L12 3Z"/><path d="M12 10v4M12 17h.01"/></>,
    filter: <path d="M3 5h18l-7 9v5l-4 2v-7L3 5Z"/>,
    plus: <><path d="M12 5v14M5 12h14"/></>,
    terminal: <><rect x="3" y="4" width="18" height="16" rx="2"/><path d="m7 9 3 3-3 3M12 15h5"/></>,
    database: <><ellipse cx="12" cy="5" rx="8" ry="3"/><path d="M4 5v6c0 1.7 3.6 3 8 3s8-1.3 8-3V5"/><path d="M4 11v6c0 1.7 3.6 3 8 3s8-1.3 8-3v-6"/></>,
    file: <><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6Z"/><path d="M14 2v6h6"/></>,
    download: <><path d="M12 3v13M6 11l6 6 6-6M5 21h14"/></>,
    eye: <><path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7-10-7-10-7Z"/><circle cx="12" cy="12" r="3"/></>,
    eyeOff: <><path d="M3 3l18 18M10.6 5.1A9 9 0 0 1 22 12s-2 4-5.5 6M6.1 6.1C3 8.3 2 12 2 12s4 7 10 7a9 9 0 0 0 4-.9"/><path d="M9.9 9.9a3 3 0 0 0 4.2 4.2"/></>,
    route: <><circle cx="6" cy="19" r="2"/><circle cx="18" cy="5" r="2"/><path d="M8 19h5a4 4 0 0 0 4-4v-4a4 4 0 0 1 1-3"/></>,
    flash: <path d="M7 2v11h3v9l7-12h-4l3-8H7Z"/>,
    brain: <><path d="M9 3a3 3 0 0 0-3 3v1a3 3 0 0 0-1 5.5V14a3 3 0 0 0 3 3v1a2 2 0 0 0 4 0V6a3 3 0 0 0-3-3Z"/><path d="M15 3a3 3 0 0 1 3 3v1a3 3 0 0 1 1 5.5V14a3 3 0 0 1-3 3v1a2 2 0 0 1-4 0"/></>,
    message: <><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10Z"/></>,
    mail: <><rect x="3" y="5" width="18" height="14" rx="2"/><path d="m3 7 9 6 9-6"/></>,
    teams: <><rect x="3" y="4" width="11" height="16" rx="2"/><path d="M6 8h5M6 11h5M8.5 11v7M16 8h4M16 12h4M16 16h4"/></>,
    cpu: <><rect x="6" y="6" width="12" height="12" rx="1"/><path d="M9 2v2M12 2v2M15 2v2M9 20v2M12 20v2M15 20v2M2 9h2M2 12h2M2 15h2M20 9h2M20 12h2M20 15h2"/></>,
    link: <><path d="M10 14a5 5 0 0 0 7 0l3-3a5 5 0 0 0-7-7l-1 1"/><path d="M14 10a5 5 0 0 0-7 0l-3 3a5 5 0 0 0 7 7l1-1"/></>,
    folder: <><path d="M4 5h5l2 2h9v11a2 2 0 0 1-2 2H4V5Z"/></>,
    send: <><path d="M22 2 11 13"/><path d="M22 2 15 22l-4-9-9-4 20-7Z"/></>,
    refresh: <><path d="M3 12a9 9 0 0 1 15-6.7L21 8"/><path d="M21 3v5h-5"/><path d="M21 12a9 9 0 0 1-15 6.7L3 16"/><path d="M3 21v-5h5"/></>,
    copy: <><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></>,
    calendar: <><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 10h18M8 3v4M16 3v4"/></>,
    tag: <><path d="M2 12 12 2h8v8L10 20l-8-8Z"/><circle cx="15" cy="9" r="1" fill={color}/></>,
    star: <path d="m12 3 3 6 6 1-4.5 4 1 6.5-5.5-3-5.5 3 1-6.5L3 10l6-1 3-6Z"/>,
    command: <><path d="M18 3a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3H6a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3V6a3 3 0 0 0-3-3 3 3 0 0 0-3 3 3 3 0 0 0 3 3h12a3 3 0 0 0 3-3 3 3 0 0 0-3-3Z"/></>,
    "log-out": <><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/><path d="m16 17 5-5-5-5"/><path d="M21 12H9"/></>,
  };
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none"
      stroke={color} strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round"
      className={className} style={{flexShrink: 0}}>
      {paths[name]}
    </svg>
  );
};

window.Icon = Icon;