// Minimal stroke icons. 1.5 stroke, 16px box.
const Icon = ({ d, size = 16, stroke = "currentColor", fill = "none", sw = 1.5, style, ...rest }) => (
  <svg width={size} height={size} viewBox="0 0 24 24" fill={fill} stroke={stroke} strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round" style={{flex:"none", ...style}} {...rest}>
    {typeof d === "string" ? <path d={d} /> : d}
  </svg>
);

const I = {
  search: (p) => <Icon {...p} d={<><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></>} />,
  bell:   (p) => <Icon {...p} d="M6 8a6 6 0 1 1 12 0c0 5 2 6 2 7H4c0-1 2-2 2-7Zm4 11a2 2 0 0 0 4 0" />,
  bolt:   (p) => <Icon {...p} d="M13 2 4 14h7l-1 8 9-12h-7l1-8Z" />,
  filter: (p) => <Icon {...p} d="M3 5h18M6 12h12M10 19h4" />,
  grid:   (p) => <Icon {...p} d={<><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/></>} />,
  list:   (p) => <Icon {...p} d="M3 6h18M3 12h18M3 18h18" />,
  chev:   (p) => <Icon {...p} d="m6 9 6 6 6-6" />,
  chevR:  (p) => <Icon {...p} d="m9 6 6 6-6 6" />,
  plus:   (p) => <Icon {...p} d="M12 5v14M5 12h14" />,
  x:      (p) => <Icon {...p} d="M6 6l12 12M18 6 6 18" />,
  check:  (p) => <Icon {...p} d="m5 12 5 5L20 7" />,
  pause:  (p) => <Icon {...p} d="M6 5v14M18 5v14" />,
  play:   (p) => <Icon {...p} d="M7 5v14l12-7Z" />,
  ext:    (p) => <Icon {...p} d="M14 4h6v6M10 14 20 4M19 14v6H5V5h6" />,
  ring:   (p) => <Icon {...p} d={<><circle cx="12" cy="14" r="6"/><path d="M9 8 11 4h2l2 4"/></>} />,
  scale:  (p) => <Icon {...p} d="M12 4v16M5 8h14M6 8l-3 6h6Zm12 0-3 6h6Z" />,
  spark:  (p) => <Icon {...p} d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8" />,
  save:   (p) => <Icon {...p} d="M5 5h11l3 3v11H5z M8 5v5h7V5 M8 19v-6h8v6" />,
  cog:    (p) => <Icon {...p} d={<><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1Z"/></>} />,
  eye:    (p) => <Icon {...p} d={<><path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12Z"/><circle cx="12" cy="12" r="3"/></>} />,
  flame:  (p) => <Icon {...p} d="M12 2s4 4 4 8a4 4 0 0 1-8 0c0-1 .5-2 1-3 0 2 1 3 2 3-2-3 1-6 1-8Z M6 14a6 6 0 0 0 12 0c0 4-3 8-6 8s-6-4-6-8Z" />,
  diamond:(p) => <Icon {...p} d="M6 3h12l3 5-9 13L3 8Z M3 8h18 M9 3 7 8l5 13 5-13-2-5" />,
  tag:    (p) => <Icon {...p} d={<><path d="M3 12V4h8l10 10-8 8L3 12Z"/><circle cx="8" cy="8" r="1.5"/></>} />,
  pulse:  (p) => <Icon {...p} d="M3 12h4l3-8 4 16 3-8h4" />,
  arrow:  (p) => <Icon {...p} d="M5 12h14m-6-6 6 6-6 6" />,
  refresh:(p) => <Icon {...p} d="M21 12a9 9 0 1 1-3-6.7L21 8 M21 3v5h-5" />,
  sliders:(p) => <Icon {...p} d="M4 6h10M18 6h2 M4 12h2M10 12h10 M4 18h12M18 18h2 M16 4v4 M8 10v4 M16 16v4" />,
  menu:   (p) => <Icon {...p} d="M3 6h18M3 12h18M3 18h18" />,
  mail:   (p) => <Icon {...p} d="M3 6h18v12H3z M3 6l9 7 9-7" />,
  msg:    (p) => <Icon {...p} d="M21 12a8 8 0 0 1-12 7l-6 2 2-5A8 8 0 1 1 21 12Z" />,
  hash:   (p) => <Icon {...p} d="M5 9h14M5 15h14M10 4 8 20M16 4l-2 16" />,
  drag:   (p) => <Icon {...p} d="M9 6h.01M15 6h.01M9 12h.01M15 12h.01M9 18h.01M15 18h.01" sw={2.5} />,
  star:   (p) => <Icon {...p} d="M12 3l2.6 5.6 6.1.7-4.6 4.2 1.3 6L12 16.7 6.6 19.5l1.3-6L3.3 9.3l6.1-.7Z" />,
};

window.Icon = Icon;
window.I = I;
