// Real Lucide icons, inlined. A cross-origin SVG used as a CSS mask does NOT clip
// in Chrome, so we fetch each icon's SVG markup once (unpkg sends CORS headers),
// recolor via currentColor, and inject it. Exposed as window.CJIcon.
const LUCIDE_BASE = 'https://unpkg.com/lucide-static@0.460.0/icons/';
const _cjIconCache = {};
function CJIcon({ name, size = 20, color = 'currentColor', style }) {
  const [svg, setSvg] = React.useState(_cjIconCache[name] || '');
  React.useEffect(() => {
    let live = true;
    if (_cjIconCache[name]) { setSvg(_cjIconCache[name]); return; }
    fetch(LUCIDE_BASE + name + '.svg')
      .then((r) => r.text())
      .then((t) => {
        const clean = t.replace(/width="24"/, 'width="100%"').replace(/height="24"/, 'height="100%"');
        _cjIconCache[name] = clean;
        if (live) setSvg(clean);
      })
      .catch(() => {});
    return () => { live = false; };
  }, [name]);
  return (
    <span aria-hidden="true"
      style={{ display: 'inline-flex', width: size, height: size, color, flexShrink: 0, ...style }}
      dangerouslySetInnerHTML={{ __html: svg }} />
  );
}
window.CJIcon = CJIcon;