(function registerFreeSeoEvidenceUploadWizard(global) {
  const React = global.React;
  if (!React) return;

  function parseHeaders(text) {
    const first = String(text || '').split(/\r?\n/).find((line) => line.trim()) || '';
    if (!first) return [];
    const delimiter = first.indexOf('\t') >= 0 ? '\t' : first.indexOf(';') >= 0 ? ';' : ',';
    return first.split(delimiter).map((header) => header.replace(/^"|"$/g, '').trim()).filter(Boolean);
  }

  function autoMapping(headers, provider) {
    function find(pattern) { return headers.find((header) => pattern.test(header)); }
    const mapping = {};
    mapping.query = find(/query|keyword|term/i) || '';
    mapping.page = find(/landing|page|url|path/i) || '';
    mapping.clicks = find(/click/i) || '';
    mapping.impressions = find(/impression/i) || '';
    mapping.ctr = find(/ctr|click.?through/i) || '';
    mapping.position = find(/position|rank/i) || '';
    mapping.sessions = find(/session/i) || '';
    mapping.users = find(/user/i) || '';
    mapping.engagementRate = find(/engagement/i) || '';
    mapping.conversions = find(/conversion|key event|goal|purchase/i) || '';
    mapping.country = find(/country/i) || '';
    mapping.device = find(/device/i) || '';
    mapping.date = find(/date|day|week|month/i) || '';
    mapping.channel = find(/channel|source|medium/i) || '';
    Object.keys(mapping).forEach((key) => { if (!mapping[key]) delete mapping[key]; });
    return mapping;
  }

  function EvidenceUploadWizard(props) {
    const [provider, setProvider] = React.useState('gsc');
    const [format, setFormat] = React.useState('paste');
    const [websiteUrl, setWebsiteUrl] = React.useState('https://example.com');
    const [websiteId, setWebsiteId] = React.useState('');
    const [auditId, setAuditId] = React.useState('');
    const [rawText, setRawText] = React.useState('Query,Page,Clicks,Impressions,CTR,Position\nai seo audit,https://example.com/ai-seo,12,1200,1%,8.4');
    const [observationText, setObservationText] = React.useState('AI overview citation observed | ai seo audit | https://example.com/ai-seo');
    const [mapping, setMapping] = React.useState({ Query: 'Query' });

    const headers = React.useMemo(() => parseHeaders(rawText), [rawText]);
    React.useEffect(() => { if (headers.length) setMapping(autoMapping(headers, provider)); }, [provider, rawText]);

    function buildObservations() {
      if (!(provider === 'screenshot' || format === 'image')) return [];
      return String(observationText || '').split('\n').map((line, index) => {
        const parts = line.split('|').map((part) => part.trim());
        return { id: `obs_${index + 1}`, title: parts[0] || 'Manual observation', query: parts[1] || '', page: parts[2] || '', note: parts[3] || parts[0] || '', confidence: 'medium' };
      }).filter((item) => item.title || item.query || item.page || item.note);
    }

    function submit(event) {
      event.preventDefault();
      const payload = {
        provider,
        format,
        websiteUrl: websiteUrl || undefined,
        websiteId: websiteId || undefined,
        auditId: auditId || undefined,
        mapping,
        rawText: provider === 'screenshot' || format === 'image' ? undefined : rawText,
        observations: buildObservations(),
        notes: provider === 'screenshot' ? 'Manual screenshot/observation evidence. OCR is intentionally not required.' : undefined
      };
      props.onSubmit(payload);
    }

    return <form className="free-seo-card free-seo-form" onSubmit={submit}>
      <div className="free-seo-card-header"><div><h3>Import evidence</h3><p>Paste GSC, Bing, GA4, manual CSV/TSV/JSON, or record screenshot observations without OAuth/API keys.</p></div></div>
      <div className="free-seo-grid-2"><label>Provider<select value={provider} onChange={(event) => { setProvider(event.target.value); setFormat(event.target.value === 'screenshot' ? 'image' : 'paste'); }}><option value="gsc">Google Search Console CSV</option><option value="bing">Bing Webmaster CSV</option><option value="ga4">GA4 CSV/JSON</option><option value="manual">Manual CSV/TSV</option><option value="screenshot">Screenshot/manual observation</option></select></label><label>Format<select value={format} onChange={(event) => setFormat(event.target.value)}><option value="paste">Paste</option><option value="csv">CSV</option><option value="tsv">TSV</option><option value="json">JSON rows</option><option value="image">Screenshot/observation</option></select></label></div>
      <div className="free-seo-grid-2"><label>Website URL<input value={websiteUrl} onChange={(event) => setWebsiteUrl(event.target.value)} placeholder="https://example.com" /></label><label>Website ID<input value={websiteId} onChange={(event) => setWebsiteId(event.target.value)} placeholder="optional" /></label></div>
      <label>Audit ID<input value={auditId} onChange={(event) => setAuditId(event.target.value)} placeholder="optional" /></label>
      {(provider === 'screenshot' || format === 'image') ? <label>Observations <small>One per line: title | query | page | note</small><textarea rows="7" value={observationText} onChange={(event) => setObservationText(event.target.value)} /></label> : <label>Paste CSV/TSV/JSON evidence<textarea rows="10" value={rawText} onChange={(event) => setRawText(event.target.value)} /></label>}
      {!(provider === 'screenshot' || format === 'image') && <global.FreeSeoColumnMappingTable headers={headers} mapping={mapping} onChange={setMapping} />}
      <button type="submit" disabled={props.loading}>{props.loading ? 'Importing...' : 'Import and validate evidence'}</button>
    </form>;
  }

  global.FreeSeoEvidenceUploadWizard = EvidenceUploadWizard;
})(window);