// SF-style line icons. All accept size + color. 1.6 stroke, rounded.
const Icon = ({ d, size = 22, color = "currentColor", fill, stroke = 1.6, viewBox = "0 0 24 24", children, style }) => (
  <svg width={size} height={size} viewBox={viewBox} fill={fill || "none"}
       stroke={fill ? "none" : color} strokeWidth={stroke}
       strokeLinecap="round" strokeLinejoin="round" style={style}>
    {d ? <path d={d}/> : children}
  </svg>
);

const I = {
  Home:    (p) => <Icon {...p}><path d="M3 11l9-8 9 8M5 9.5V20a1 1 0 001 1h4v-6h4v6h4a1 1 0 001-1V9.5"/></Icon>,
  Heart:   (p) => <Icon {...p}><path d="M12 21s-7-4.5-9.5-9.5C1 8 3 4 7 4c2 0 3.5 1.5 5 3 1.5-1.5 3-3 5-3 4 0 6 4 4.5 7.5C19 16.5 12 21 12 21z"/></Icon>,
  Stream:  (p) => <Icon {...p}><circle cx="6" cy="6" r="2"/><circle cx="6" cy="18" r="2"/><path d="M8 6h11M8 18h11M3 12h18"/></Icon>,
  Cal:     (p) => <Icon {...p}><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 9h18M8 3v4M16 3v4"/></Icon>,
  User:    (p) => <Icon {...p}><circle cx="12" cy="8" r="4"/><path d="M4 21c0-4 4-7 8-7s8 3 8 7"/></Icon>,
  Plus:    (p) => <Icon {...p}><path d="M12 5v14M5 12h14"/></Icon>,
  Check:   (p) => <Icon {...p}><path d="M5 12.5l4.5 4.5L19 7"/></Icon>,
  Close:   (p) => <Icon {...p}><path d="M6 6l12 12M18 6L6 18"/></Icon>,
  Chev:    (p) => <Icon {...p}><path d="M9 6l6 6-6 6"/></Icon>,
  Down:    (p) => <Icon {...p}><path d="M6 9l6 6 6-6"/></Icon>,
  Up:      (p) => <Icon {...p}><path d="M6 15l6-6 6 6"/></Icon>,
  Flame:   (p) => <Icon {...p}><path d="M12 3s5 4 5 9a5 5 0 01-10 0c0-2 1-3 1-3s2 1 2.5 3c0-3 1.5-6 1.5-9z"/></Icon>,
  Bolt:    (p) => <Icon {...p}><path d="M13 3L5 14h6l-1 7 8-11h-6l1-7z"/></Icon>,
  Star:    (p) => <Icon {...p}><path d="M12 3l2.7 5.6 6.3.9-4.5 4.4 1 6.1L12 17l-5.5 3 1-6.1L3 9.5l6.3-.9L12 3z"/></Icon>,
  Moon:    (p) => <Icon {...p}><path d="M21 13a8 8 0 11-10-10 6 6 0 0010 10z"/></Icon>,
  Sun:     (p) => <Icon {...p}><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M2 12h2M20 12h2M5 5l1.5 1.5M17.5 17.5L19 19M19 5l-1.5 1.5M6.5 17.5L5 19"/></Icon>,
  Bell:    (p) => <Icon {...p}><path d="M6 16V11a6 6 0 1112 0v5l1.5 2H4.5L6 16zM10 20a2 2 0 004 0"/></Icon>,
  Send:    (p) => <Icon {...p}><path d="M3 12L21 4l-4 17-4-7-7-2z"/></Icon>,
  Mic:     (p) => <Icon {...p}><rect x="9" y="3" width="6" height="12" rx="3"/><path d="M5 11a7 7 0 0014 0M12 18v3"/></Icon>,
  Camera:  (p) => <Icon {...p}><path d="M3 7h4l2-3h6l2 3h4v13H3V7z"/><circle cx="12" cy="13" r="4"/></Icon>,
  Cog:     (p) => <Icon {...p}><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 00.3 1.8l.1.1a2 2 0 11-2.9 2.9l-.1-.1a1.7 1.7 0 00-1.8-.3 1.7 1.7 0 00-1 1.5V21a2 2 0 11-4 0v-.1a1.7 1.7 0 00-1-1.5 1.7 1.7 0 00-1.8.3l-.1.1a2 2 0 11-2.9-2.9l.1-.1a1.7 1.7 0 00.3-1.8 1.7 1.7 0 00-1.5-1H3a2 2 0 110-4h.1a1.7 1.7 0 001.5-1 1.7 1.7 0 00-.3-1.8l-.1-.1a2 2 0 112.9-2.9l.1.1a1.7 1.7 0 001.8.3H9a1.7 1.7 0 001-1.5V3a2 2 0 114 0v.1a1.7 1.7 0 001 1.5 1.7 1.7 0 001.8-.3l.1-.1a2 2 0 112.9 2.9l-.1.1a1.7 1.7 0 00-.3 1.8V9a1.7 1.7 0 001.5 1H21a2 2 0 110 4h-.1a1.7 1.7 0 00-1.5 1z"/></Icon>,
  Wifi:    (p) => <Icon {...p}><path d="M5 12.5a10 10 0 0114 0M8 16a6 6 0 018 0"/><circle cx="12" cy="19" r="1.2" fill="currentColor"/></Icon>,
  Off:     (p) => <Icon {...p}><path d="M3 3l18 18M8.5 8.5A6 6 0 0116 16M5 12.5a10 10 0 016-3.4"/></Icon>,
  Lock:    (p) => <Icon {...p}><rect x="5" y="11" width="14" height="10" rx="2"/><path d="M8 11V8a4 4 0 018 0v3"/></Icon>,
  Edit:    (p) => <Icon {...p}><path d="M4 20h4l11-11-4-4L4 16v4zM13 6l4 4"/></Icon>,
  Trash:   (p) => <Icon {...p}><path d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13M10 11v6M14 11v6"/></Icon>,
  Mood:    (p) => <Icon {...p}><circle cx="12" cy="12" r="9"/><circle cx="9" cy="10" r=".8" fill="currentColor"/><circle cx="15" cy="10" r=".8" fill="currentColor"/><path d="M8.5 14.5a4 4 0 007 0"/></Icon>,
  Target:  (p) => <Icon {...p}><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="5"/><circle cx="12" cy="12" r="1.5" fill="currentColor"/></Icon>,
  Sparkle: (p) => <Icon {...p}><path d="M12 3l1.5 4.5L18 9l-4.5 1.5L12 15l-1.5-4.5L6 9l4.5-1.5L12 3zM5 16l.7 2 2 .7-2 .7L5 21l-.7-1.6L2.3 19l2-.7L5 16zM19 14l.7 1.7 1.7.7-1.7.7-.7 1.7-.7-1.7-1.7-.7 1.7-.7L19 14z" fill="currentColor" stroke="none"/></Icon>,
  Search:  (p) => <Icon {...p}><circle cx="11" cy="11" r="7"/><path d="M16 16l5 5"/></Icon>,
  Chat:    (p) => <Icon {...p}><path d="M4 5h16v11H8l-4 4V5z"/></Icon>,
  Zoom:    (p) => <Icon {...p}><circle cx="11" cy="11" r="7"/><path d="M16 16l5 5M8 11h6M11 8v6"/></Icon>,
  Play:    (p) => <Icon {...p}><path d="M8 5l11 7-11 7V5z" fill="currentColor"/></Icon>,
  Compass: (p) => <Icon {...p}><circle cx="12" cy="12" r="9"/><path d="M14.5 9.5l-1.5 4.5-4.5 1.5 1.5-4.5L14.5 9.5z" fill="currentColor" stroke="none"/></Icon>,
  Drop:    (p) => <Icon {...p}><path d="M12 3s6 7 6 11a6 6 0 11-12 0c0-4 6-11 6-11z"/></Icon>,
};

window.I = I;
