// Moderis — gedeelde data, iconen (inline SVG) + helpers. Naar window.
// Geladen vóór de richting-bestanden.

// ---- Inline SVG iconen (Lucide-stijl, currentColor) ----
const M_ICONS = {
  leaf: '<path d="M11 20A7 7 0 0 1 9.8 6.1C15.5 5 17 4.48 19 2c1 2 2 4.18 2 8 0 5.5-4.78 10-10 10Z"/><path d="M2 21c0-3 1.85-5.36 5.08-6"/>',
  mug: '<path d="M17 8h1a4 4 0 1 1 0 8h-1"/><path d="M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4Z"/><path d="M6 1.5v2M10 1.5v2M14 1.5v2"/>',
  bowl: '<path d="M3 11h18a8 8 0 0 1-8 8h-2a8 8 0 0 1-8-8Z"/><path d="M8 7.5c0-1 .6-1.8 1-2.5M12 7c0-1 .6-1.8 1-2.5M16 7.5c0-1 .6-1.8 1-2.5"/>',
  apple: '<path d="M12 7.5c-1.4-2-3.8-3-5.7-2.5C3.7 5.6 2.7 8.4 3.6 11.7 4.6 15 7 19 9.4 19c1 0 1.4-.5 2.4-.5s1.4.5 2.4.5c2.4 0 4.8-4 5.8-7.3.9-3.3-.1-6.1-2.7-6.7-1.9-.5-4.3.5-5.7 2.5Z"/><path d="M12 7.5c0-2 .5-3.4 2-4.5"/>',
  fish: '<path d="M6.5 12c3-4.4 8.4-6 12.8-6-1.4 2.5-1.4 9.5 0 12-4.4 0-9.8-1.6-12.8-6Z"/><path d="M6.5 12c-1.5 0-3 1-4 2 .5-1 .5-3 0-4 1 1 2.5 2 4 2Z"/><path d="M15 9.6h.01"/>',
  steps: '<path d="M4 16v-2.4C4 11.5 3 10.5 3 8c0-2.7 1.5-6 4.5-6C9.4 2 10 3.8 10 5.5c0 3.1-2 5.7-2 8.7V16a2 2 0 1 1-4 0Z"/><path d="M20 20v-2.4c0-2.1 1-3.1 1-5.6 0-2.7-1.5-6-4.5-6C14.6 6 14 7.8 14 9.5c0 3.1 2 5.7 2 8.7V20a2 2 0 1 0 4 0Z"/>',
  moon: '<path d="M12 3a6.5 6.5 0 0 0 9 9 9 9 0 1 1-9-9Z"/>',
  heart: '<path d="M19 13.7c1.5-1.5 3-3.2 3-5.5A5.3 5.3 0 0 0 16.5 3c-1.7 0-3 .5-4.5 2-1.5-1.5-2.8-2-4.5-2A5.3 5.3 0 0 0 2 8.2c0 2.3 1.5 4 3 5.5l7 6.8Z"/><path d="M3.5 11.5H9l1-1.5 2 4 2-6 1.3 3.5h5"/>',
  spark: '<path d="M12 3l1.8 5.6a3 3 0 0 0 1.9 1.9L21 12l-5.3 1.5a3 3 0 0 0-1.9 1.9L12 21l-1.8-5.6a3 3 0 0 0-1.9-1.9L3 12l5.3-1.5a3 3 0 0 0 1.9-1.9Z"/><path d="M19 3.5v3M20.5 5h-3"/>',
  plus: '<path d="M12 5v14M5 12h14"/>',
  swap: '<path d="M3 12a9 9 0 0 1 14.7-7L21 8"/><path d="M21 3.5V8h-4.5"/><path d="M21 12a9 9 0 0 1-14.7 7L3 16"/><path d="M3 20.5V16h4.5"/>',
  arrowup: '<path d="M12 19V6M6 12l6-6 6 6"/>',
};

function MIcon({ name, size = 18, color = 'currentColor', sw = 1.8, style }) {
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor"
      strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round"
      style={{ color, display: 'block', flex: '0 0 auto', ...style }}
      dangerouslySetInnerHTML={{ __html: M_ICONS[name] || '' }} />
  );
}

function fmt(n) { return n.toLocaleString('nl-NL'); }

// Draaiende spinner voor "bezig"-knoppen/acties. Neemt de tekstkleur over.
function Spinner({ size = 15, style }) {
  return <span className="m-spin" role="status" aria-label="Bezig"
    style={{ width: size, height: size, ...style }} />;
}

Object.assign(window, { M_ICONS, MIcon, fmt, Spinner });