/* ============================================================
   Shared primitives — Icon set, Avatar, LaneChip, StageDot, etc.
   Exposes to window for use across babel scripts.
   ============================================================ */

// Lucide-style line icons (simple strokes — functional UI iconography)
const ICON_PATHS = {
  today:    '<path d="M3 9.5 12 4l9 5.5"/><path d="M5 10v9h14v-9"/><path d="M9 19v-5h6v5"/>',
  inbox:    '<path d="M3 12h5l2 3h4l2-3h5"/><path d="M5 5h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2Z"/>',
  contacts: '<circle cx="9" cy="8" r="3.2"/><path d="M3.5 19a5.5 5.5 0 0 1 11 0"/><path d="M16 6.5a3 3 0 0 1 0 5"/><path d="M17.5 19a5 5 0 0 0-3-4.6"/>',
  draft:    '<path d="M12 20h8"/><path d="M16.5 4.5a2.1 2.1 0 0 1 3 3L8 19l-4 1 1-4Z"/>',
  sequence: '<circle cx="6" cy="6" r="2.4"/><circle cx="6" cy="18" r="2.4"/><circle cx="18" cy="12" r="2.4"/><path d="M6 8.4v7.2"/><path d="M8.2 6.6c5 .4 4 5.4 7.4 5.4"/>',
  search:   '<circle cx="11" cy="11" r="6.5"/><path d="m20 20-3.2-3.2"/>',
  filter:   '<path d="M3 5h18l-7 8v5l-4 2v-7Z"/>',
  star:     '<path d="m12 3 2.6 5.6 6 .7-4.4 4.1 1.2 6L12 16.8 6.6 19.4l1.2-6L3.4 9.3l6-.7Z"/>',
  send:     '<path d="M21 4 3 11l7 2 2 7Z"/><path d="m10 13 4-4"/>',
  mail:     '<rect x="3" y="5" width="18" height="14" rx="2"/><path d="m4 7 8 6 8-6"/>',
  linkedin: '<rect x="3.5" y="3.5" width="17" height="17" rx="2.5"/><path d="M8 10v6"/><path d="M8 7v.01"/><path d="M12 16v-3.5a2 2 0 0 1 4 0V16"/><path d="M12 16v-6"/>',
  copy:     '<rect x="9" y="9" width="11" height="11" rx="2"/><path d="M5 15V5a2 2 0 0 1 2-2h8"/>',
  check:    '<path d="m4 12 5 5L20 6"/>',
  checkDouble:'<path d="m2 12 5 5 4-4"/><path d="m11 13 3 4L22 7"/>',
  chevronDown:'<path d="m6 9 6 6 6-6"/>',
  chevronRight:'<path d="m9 6 6 6-6 6"/>',
  chevronLeft:'<path d="m15 6-6 6 6 6"/>',
  x:        '<path d="M6 6 18 18M18 6 6 18"/>',
  clock:    '<circle cx="12" cy="12" r="8.5"/><path d="M12 7.5V12l3 2"/>',
  snooze:   '<circle cx="12" cy="13" r="7.5"/><path d="M12 9.5V13l2.5 1.5"/><path d="M4.5 5 8 3M19.5 5 16 3"/>',
  sparkles: '<path d="M12 4l1.6 4.4L18 10l-4.4 1.6L12 16l-1.6-4.4L6 10l4.4-1.6Z"/><path d="M18.5 16l.7 1.8 1.8.7-1.8.7-.7 1.8-.7-1.8-1.8-.7 1.8-.7Z"/>',
  plus:     '<path d="M12 5v14M5 12h14"/>',
  more:     '<circle cx="5" cy="12" r="1.4"/><circle cx="12" cy="12" r="1.4"/><circle cx="19" cy="12" r="1.4"/>',
  moreV:    '<circle cx="12" cy="5" r="1.4"/><circle cx="12" cy="12" r="1.4"/><circle cx="12" cy="19" r="1.4"/>',
  refresh:  '<path d="M21 12a9 9 0 1 1-2.6-6.4"/><path d="M21 4v4h-4"/>',
  link:     '<path d="M9 15 15 9"/><path d="M10.5 6.5 13 4a4 4 0 0 1 6 6l-2.5 2.5"/><path d="M13.5 17.5 11 20a4 4 0 0 1-6-6l2.5-2.5"/>',
  building: '<rect x="5" y="3" width="14" height="18" rx="1.5"/><path d="M9 7h1.5M13.5 7H15M9 11h1.5M13.5 11H15M9 15h1.5M13.5 15H15"/><path d="M10 21v-3h4v3"/>',
  globe:    '<circle cx="12" cy="12" r="8.5"/><path d="M3.5 12h17"/><path d="M12 3.5c2.5 2.4 2.5 14.6 0 17M12 3.5c-2.5 2.4-2.5 14.6 0 17"/>',
  calendar: '<rect x="4" y="5" width="16" height="16" rx="2"/><path d="M4 9h16M8 3v4M16 3v4"/>',
  arrowUpRight:'<path d="M7 17 17 7M9 7h8v8"/>',
  settings: '<circle cx="12" cy="12" r="3"/><path d="M12 2v3M12 19v3M5 5l2 2M17 17l2 2M2 12h3M19 12h3M5 19l2-2M17 7l2-2"/>',
  reply:    '<path d="M9 7 4 12l5 5"/><path d="M4 12h9a7 7 0 0 1 7 7v1"/>',
  archive:  '<rect x="3" y="4" width="18" height="5" rx="1"/><path d="M5 9v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V9"/><path d="M10 13h4"/>',
  flame:    '<path d="M12 3c1 3-2 4-2 7a2 2 0 0 0 4 0c0-1 0-1 .5-2 1.5 1.5 2.5 3 2.5 5a5 5 0 0 1-10 0c0-3.5 3-5 5-10Z"/>',
  trend:    '<path d="M3 17 9 11l4 4 8-8"/><path d="M15 7h6v6"/>',
  logout:   '<path d="M14 4h4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2h-4"/><path d="M9 12h11M16 8l4 4-4 4"/>',
  bell:     '<path d="M18 8a6 6 0 1 0-12 0c0 7-3 8-3 8h18s-3-1-3-8"/><path d="M10.5 21a2 2 0 0 0 3 0"/>',
  phone:    '<path d="M5 4h3l1.5 4-2 1.5a11 11 0 0 0 5 5L17 16l4 1.5V20a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2Z"/>',
  dollar:   '<path d="M12 3v18"/><path d="M16 7.5C16 5.5 14 4.5 12 4.5S8 5.5 8 7.5 10 10.5 12 11s4 1 4 3.5-2 3.5-4 3.5-4-1-4-3"/>',
  upload:   '<path d="M12 16V4M8 8l4-4 4 4"/><path d="M4 16v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2"/>',
  flag:     '<path d="M5 21V4"/><path d="M5 4h11l-2 3 2 3H5"/>',
  pause:    '<rect x="7" y="5" width="3.5" height="14" rx="1"/><rect x="13.5" y="5" width="3.5" height="14" rx="1"/>',
  mountain: '<path d="M3 19 10 6l4 7 2-3 5 9Z"/>',
  grid:     '<rect x="4" y="4" width="7" height="7" rx="1.5"/><rect x="13" y="4" width="7" height="7" rx="1.5"/><rect x="4" y="13" width="7" height="7" rx="1.5"/><rect x="13" y="13" width="7" height="7" rx="1.5"/>',
  list:     '<path d="M8 6h12M8 12h12M8 18h12"/><circle cx="4" cy="6" r="1"/><circle cx="4" cy="12" r="1"/><circle cx="4" cy="18" r="1"/>',
  panel:    '<rect x="3" y="4" width="18" height="16" rx="2"/><path d="M9 4v16"/>',
  shield:   '<path d="M12 3 5 6v5c0 4.5 3 7.5 7 9 4-1.5 7-4.5 7-9V6Z"/><path d="m9 12 2 2 4-4"/>',
  server:   '<rect x="4" y="4" width="16" height="7" rx="1.5"/><rect x="4" y="13" width="16" height="7" rx="1.5"/><path d="M8 7.5h.01M8 16.5h.01"/>',
  gauge:    '<path d="M12 13 16 9"/><circle cx="12" cy="13" r="0.5"/><path d="M4 18a8 8 0 1 1 16 0"/>',
  warning:  '<path d="M12 4 2.5 20h19Z"/><path d="M12 10v4M12 17v.01"/>',
  plug:     '<path d="M9 3v5M15 3v5"/><path d="M7 8h10v3a5 5 0 0 1-10 0Z"/><path d="M12 16v5"/>',
  instagram:'<rect x="4" y="4" width="16" height="16" rx="4.6"/><circle cx="12" cy="12" r="3.5"/><circle cx="16.6" cy="7.4" r="0.7"/>',
  userPlus: '<circle cx="9.5" cy="8" r="3.2"/><path d="M4 19a5.5 5.5 0 0 1 11 0"/><path d="M18.5 8.5v5M16 11h5"/>',
  heart:    '<path d="M12 20s-7-4.4-9.2-9C1.4 7.8 3.2 4.6 6.5 4.6c2 0 3.1 1.3 3.5 2 .4-.7 1.5-2 3.5-2 3.3 0 5.1 3.2 3.7 6.4C19 15.6 12 20 12 20Z"/>',
  branch:   '<circle cx="6" cy="6" r="2.2"/><circle cx="6" cy="18" r="2.2"/><circle cx="18" cy="18" r="2.2"/><path d="M6 8.2v3.3a3 3 0 0 0 3 3h6.8"/><path d="M6 15.8v0"/>',
  trash:    '<path d="M4 7h16M9 7V5h6v2M6 7l1 13h10l1-13"/>',
  radar:    '<path d="M12 12 18 6"/><path d="M12 3a9 9 0 1 0 9 9"/><path d="M12 8a4 4 0 1 0 4 4"/>',
  bot:      '<rect x="5" y="8" width="14" height="11" rx="3"/><path d="M12 4.5V8"/><circle cx="12" cy="3.4" r="1.2"/><path d="M9.5 13h.01M14.5 13h.01"/><path d="M2.5 12v3M21.5 12v3"/>',
};

function Icon({ name, size = 18, stroke = 1.7, style, className }) {
  const d = ICON_PATHS[name];
  if (!d) return null;
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none"
      stroke="currentColor" strokeWidth={stroke} strokeLinecap="round" strokeLinejoin="round"
      style={style} className={className} dangerouslySetInnerHTML={{ __html: d }} />
  );
}

// Filled star variant
function StarIcon({ size = 16, filled }) {
  return (
    <svg width={size} height={size} viewBox="0 0 24 24"
      fill={filled ? "var(--amber)" : "none"}
      stroke={filled ? "var(--amber)" : "currentColor"} strokeWidth="1.6" strokeLinejoin="round"
      dangerouslySetInnerHTML={{ __html: ICON_PATHS.star }} />
  );
}

function Avatar({ name, color, initials, size = 30, mono, square }) {
  const ini = initials || (window.WTC ? window.WTC.initials(name || "?") : "?");
  const bg = color || (window.WTC ? window.WTC.avColor(name || "x") : "#3E7FB8");
  return (
    <div style={{
      width: size, height: size, flex: "none",
      borderRadius: square ? Math.round(size * 0.28) : "50%",
      background: mono ? "var(--elevated)" : bg + "26",
      border: mono ? "1px solid var(--line)" : "none",
      color: mono ? "var(--text)" : bg,
      display: "flex", alignItems: "center", justifyContent: "center",
      fontSize: size * 0.38, fontWeight: 650, letterSpacing: "0.01em",
      fontFamily: mono ? "var(--mono)" : "var(--font)",
      textShadow: mono ? "none" : "0 0 0",
    }}>
      {mono || ini}
    </div>
  );
}

function LaneChip({ lane, small }) {
  const meta = window.WTC.LANE_META[lane];
  if (!meta) return null;
  return (
    <span className={"chip chip--" + meta.cls} style={small ? { height: 19, fontSize: 11, padding: "0 7px" } : null}>
      <span className="chip-dot"></span>{meta.label}
    </span>
  );
}

function StageDot({ stage, withLabel }) {
  const meta = window.WTC.STAGE_META[stage];
  if (!meta) return null;
  return (
    <span style={{ display: "inline-flex", alignItems: "center", gap: 7 }}>
      <span className="stagedot" style={{ background: meta.color }}></span>
      {withLabel && <span style={{ fontSize: 12.5, color: "var(--text-2)" }}>{meta.label}</span>}
    </span>
  );
}

function fmtMoney(v) {
  if (!v) return "—";
  if (v >= 1000) return "$" + (v / 1000).toFixed(v % 1000 === 0 ? 0 : 1) + "k";
  return "$" + v;
}

// Tooltip-free pill button used in rows
function RowAction({ icon, label, onClick, tone }) {
  return (
    <button className="btn btn--sm btn--ghost" onClick={onClick}
      style={tone === "primary" ? { color: "var(--accent)" } : null}>
      <Icon name={icon} size={14} />{label}
    </button>
  );
}

Object.assign(window, { Icon, StarIcon, Avatar, LaneChip, StageDot, fmtMoney, RowAction });
