// icons.jsx — Ryoko · curated SVG icon set
//
// 24 stroke icons on a 20px grid · stroke-width 1.5 · stroke-linecap round.
// Inline unicode glyphs (★ ↗ + − →) read as hackathon; this set reads as
// house. Every glyph is hand-tuned for the Cormorant + Inter type system.
//
// Usage:
//   <window.RyokoIcon name="arrow-right" />
//   <window.RyokoIcon name="document" size={14} stroke="#b08968" />
//
// The RyokoIcon component returns a transparent SVG that inherits color
// from CSS `color`. For static one-shot replacements anywhere in the app,
// the named exports on window.RyokoIcons are paths only.

(function () {
  // ── Path library ── 20×20 viewBox · stroke="currentColor" ───────────────
  const PATHS = {
    // Movement / direction
    "arrow-right":     <><path d="M4 10h12" /><path d="m11 5 5 5-5 5" /></>,
    "arrow-up-right":  <><path d="m6 14 8-8" /><path d="M8 6h6v6" /></>,
    "arrow-down":      <><path d="M10 4v12" /><path d="m5 11 5 5 5-5" /></>,
    "chevron-right":   <path d="m7 4 6 6-6 6" />,
    "chevron-down":    <path d="m4 7 6 6 6-6" />,

    // Status
    "plus":            <><path d="M10 4v12" /><path d="M4 10h12" /></>,
    "minus":           <path d="M4 10h12" />,
    "check":           <path d="m4 10 4 4 8-8" />,
    "close":           <><path d="m4 4 12 12" /><path d="m16 4-12 12" /></>,
    "dot":             <circle cx="10" cy="10" r="2.4" />,

    // Information / navigation
    "search":          <><circle cx="9" cy="9" r="5" /><path d="m13 13 3 3" /></>,
    "bell":            <><path d="M5 8a5 5 0 0 1 10 0c0 6 2.5 7.5 2.5 7.5h-15S5 14 5 8" /><path d="M8.5 17.5a1.6 1.6 0 0 0 3 0" /></>,
    "eye":             <><path d="M2 10s3-5 8-5 8 5 8 5-3 5-8 5-8-5-8-5" /><circle cx="10" cy="10" r="2.5" /></>,
    "eye-off":         <><path d="M3 10s3-5 7-5c2 0 3.6 1 5 2.5" /><path d="M17 10s-3 5-7 5c-2 0-3.6-1-5-2.5" /><path d="m3 3 14 14" /></>,
    "lock":            <><rect x="4" y="9" width="12" height="8" rx="1" /><path d="M7 9V7a3 3 0 0 1 6 0v2" /></>,
    "shield":          <path d="M10 2 4 4v6c0 4 2.5 6.5 6 8 3.5-1.5 6-4 6-8V4l-6-2z" />,

    // Documents / objects
    "document":        <><path d="M5 3h7l3 3v11a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1z" /><path d="M12 3v3h3" /></>,
    "calendar":        <><rect x="3" y="5" width="14" height="12" rx="1" /><path d="M3 9h14" /><path d="M7 3v3M13 3v3" /></>,
    "key":             <><circle cx="6" cy="14" r="2.5" /><path d="m8 12 8-8" /><path d="m12 4 3 3M14 6l3 3" /></>,
    "fire":            <path d="M10 17c-3 0-5-2.2-5-5 0-2.5 2-3.5 2-6 1 1 1.5 2 1.5 2 0-2 1.5-4 1.5-5 1 1 4 3.5 4 9 0 2.8-2 5-4 5z" />,
    "leaf":            <path d="M16 4c-1 7-5 11-12 12 1-4 2-7 5-9s5-2.5 7-3z" />,
    "wine":            <><path d="M6 4h8v3a4 4 0 0 1-8 0z" /><path d="M10 11v5" /><path d="M7 17h6" /></>,
    "tea":             <><path d="M5 9h9v3a3 3 0 0 1-3 3H8a3 3 0 0 1-3-3z" /><path d="M14 10h2a1.5 1.5 0 0 1 0 3h-2" /><path d="M7 6c0-1 1-1 1-2M10 6c0-1 1-1 1-2" /></>,
    "fork-knife":      <><path d="M5 3v6a2 2 0 0 0 2 2v6" /><path d="M5 3v3M9 3v3" /><path d="M14 3c-1.5 0-2 2-2 4s.5 4 2 4v6" /></>,

    // Travel
    "plane":           <path d="M9 17 11 11 17 9 4 5 6 11 4 14 9 17z" />,
    "ship":            <><path d="M2 16h16" /><path d="M3 12h14l-3-4H6z" /><path d="M10 8V4" /></>,
    "mountain":        <path d="M2 16h16L13 6l-3 5-2-2z" />,

    // Place / member
    "house":           <path d="m2 9 8-7 8 7v8a1 1 0 0 1-1 1h-4v-6H7v6H3a1 1 0 0 1-1-1z" />,
    "user":            <><circle cx="10" cy="7" r="3" /><path d="M3 17a7 7 0 0 1 14 0" /></>,
    "users":           <><circle cx="7" cy="7" r="2.5" /><circle cx="14" cy="7" r="2" /><path d="M2 16a5 5 0 0 1 10 0" /><path d="M12 14a4 4 0 0 1 6 2" /></>,

    // Editorial
    "star":            <path d="m10 3 2.2 4.5L17 8.2l-3.5 3.4.8 4.9L10 14.2 5.7 16.5l.8-4.9L3 8.2l4.8-.7z" />,
    "feather":         <><path d="M4 16 14 6a4 4 0 0 1 0 6L8 18z" /><path d="M14 6 8 12" /><path d="M11 9h4" /></>,
    "sparkle":         <path d="M10 3v4M10 13v4M3 10h4M13 10h4M5 5l3 3M12 12l3 3M5 15l3-3M12 8l3-3" />,
  };

  function Icon({ name, size = 16, stroke, fill = "none", className, "aria-label": aria, title }) {
    const path = PATHS[name];
    if (!path) {
      // Graceful fallback · render a small dot if name not found
      return (
        <svg width={size} height={size} viewBox="0 0 20 20" className={className}
             fill="none" stroke={stroke || "currentColor"} strokeWidth="1.5"
             strokeLinecap="round" strokeLinejoin="round" aria-label={aria || `icon · ${name}`}>
          <circle cx="10" cy="10" r="1.6" />
        </svg>
      );
    }
    return (
      <svg width={size} height={size} viewBox="0 0 20 20" className={className}
           fill={fill} stroke={stroke || "currentColor"} strokeWidth="1.5"
           strokeLinecap="round" strokeLinejoin="round"
           aria-label={aria} role={aria ? "img" : "presentation"}>
        {title && <title>{title}</title>}
        {path}
      </svg>
    );
  }

  // Convenience · render N stars at a given size
  function Stars({ n = 5, size = 12, filled = true }) {
    return (
      <span aria-label={`${n} of 5`} role="img" style={{ display: "inline-flex", gap: 1 }}>
        {Array.from({ length: n }, (_, i) => (
          <svg key={i} width={size} height={size} viewBox="0 0 20 20"
               fill={filled ? "currentColor" : "none"} stroke="currentColor" strokeWidth="1.5"
               strokeLinecap="round" strokeLinejoin="round">
            <path d="m10 3 2.2 4.5L17 8.2l-3.5 3.4.8 4.9L10 14.2 5.7 16.5l.8-4.9L3 8.2l4.8-.7z" />
          </svg>
        ))}
      </span>
    );
  }

  window.RyokoIcon = Icon;
  window.RyokoStars = Stars;
  window.RyokoIconNames = Object.keys(PATHS);
})();
