// BiblicaDrawer — opens when the user clicks an empty-state pericope
// in the coverage map. Uses the same `.amos-drawer` chrome as
// ReaderDrawerV2 so this feels like the same surface with a simpler
// payload: a Biblica courtesy preview of the passage in the coverage
// language + commission CTAs.

function BiblicaDrawer({ open, pericope, coverLang, onClose, onCommission }) {
  const I = window.useI18n();
  const [commissionTarget, setCommissionTarget] = React.useState(null);

  React.useEffect(() => {
    const h = (e) => { if (e.key === 'Escape' && open) onClose(); };
    window.addEventListener('keydown', h);
    return () => window.removeEventListener('keydown', h);
  }, [open, onClose]);

  if (!pericope && !open) return null;
  const p = pericope || {};

  const langObj = I.LANGUAGES.find(l => l.code === coverLang) || I.LANGUAGES[0];
  const langName = langObj.native;
  const refLabel = p.ref || 'Pericope';

  // Placeholder-prose translations. Explicitly not verbatim NIV.
  const TEXT = {
    en: {
      title:'Romans 8:28–30',
      verses: [
        { n:28, t:'And we know that in all things God works for the good of those who love him, who have been called according to his purpose.' },
        { n:29, t:'For those God foreknew he also predestined to be conformed to the image of his Son, that he might be the firstborn among many brothers and sisters.' },
        { n:30, t:'And those he predestined, he also called; those he called, he also justified; those he justified, he also glorified.' },
      ]
    },
    es: {
      title:'Romanos 8:28–30',
      verses: [
        { n:28, t:'Ahora bien, sabemos que Dios dispone todas las cosas para el bien de quienes lo aman, los que han sido llamados de acuerdo con su propósito.' },
        { n:29, t:'Porque a los que Dios conoció de antemano, también los predestinó a ser transformados según la imagen de su Hijo, para que él sea el primogénito entre muchos hermanos.' },
        { n:30, t:'A los que predestinó, también los llamó; a los que llamó, también los justificó; y a los que justificó, también los glorificó.' },
      ]
    },
    ca: {
      title:'Romans 8:28–30',
      verses: [
        { n:28, t:'I sabem que totes les coses obren per al bé dels qui estimen Déu, dels qui són cridats segons el seu designi.' },
        { n:29, t:'Perquè aquells que ell coneixia des d\u2019abans, també els ha destinat a ser imatge del seu Fill, perquè sigui el primogènit de molts germans.' },
        { n:30, t:'I als qui ha destinat, també els ha cridat; als qui ha cridat, també els ha justificat; i als qui ha justificat, també els ha glorificat.' },
      ]
    },
    pt: {
      title:'Romanos 8:28–30',
      verses: [
        { n:28, t:'Sabemos que Deus age em todas as coisas para o bem daqueles que o amam, dos que foram chamados de acordo com o seu propósito.' },
        { n:29, t:'Porque aqueles que de antemão conheceu, também os predestinou para serem conformes à imagem de seu Filho, a fim de que ele seja o primogênito entre muitos irmãos.' },
        { n:30, t:'E aos que predestinou, a esses também chamou; e aos que chamou, a esses também justificou; e aos que justificou, a esses também glorificou.' },
      ]
    },
    fr: {
      title:'Romains 8:28–30',
      verses: [
        { n:28, t:'Or, nous savons que toutes choses concourent au bien de ceux qui aiment Dieu, de ceux qui sont appelés selon son dessein.' },
        { n:29, t:'Car ceux qu\u2019il a connus d\u2019avance, il les a aussi prédestinés à être conformes à l\u2019image de son Fils, afin que son Fils soit le premier-né d\u2019un grand nombre de frères.' },
        { n:30, t:'Et ceux qu\u2019il a prédestinés, il les a aussi appelés ; et ceux qu\u2019il a appelés, il les a aussi justifiés ; et ceux qu\u2019il a justifiés, il les a aussi glorifiés.' },
      ]
    },
  };
  const text = TEXT[coverLang] || null;

  // Localized chrome (EN/ES/CA for now; other UI langs fall back to EN)
  const chromeMap = {
    en: {
      badge:'Courtesy of Biblica · read-only preview',
      sub:'No analytical translation yet — here\u2019s the Biblica reference text so the passage still reads in ' + langName + '.',
      why:'Dynamic-equivalence translations like Biblica\u2019s prioritise readability over grammatical fidelity. Excellent for devotional reading; not sufficient for exegetical work. An analytical translation would add source-grammar visibility, pericope structure, and cross-reference scaffolding.',
      whyH:'Why a Biblica text, and not one of ours?',
      commissionH:'Commission deeper work',
      cBasic:'Analytical translation', cBasicSub:'AI-generated analytical apparatus — morphology, lexical notes. Delivered in minutes.',
      cFull:'Annotated translation',  cFullSub:'AI-generated Reader’s + layered footnotes. Delivered in minutes.',
      cBook:'Whole book',              cBookSub:'Commission the full book in this language in one go.',
      missingH:'We don\u2019t have Biblica ' + langName + ' yet',
      missingB:'Biblica covers ~40 gateway languages. ' + langName + ' isn\u2019t in that corpus, so we can\u2019t preview the passage here. Commissioning the analytical translation would produce the first rendering of this passage in ' + langName + ' on The Amos Project.',
      eyebrow:'Pericope · no analytical work yet'
    },
    es: {
      badge:'Cortesía de Biblica · vista de solo lectura',
      sub:'Todavía no hay traducción analítica — aquí tienes el texto de referencia de Biblica para que el pasaje pueda leerse en ' + langName + '.',
      why:'Las traducciones de equivalencia dinámica como la NVI priorizan la lectura sobre la fidelidad gramatical. Son excelentes para lectura devocional pero no soportan el trabajo exegético. Una traducción analítica te daría visibilidad de la gramática del original, análisis de perícopa y cross-references.',
      whyH:'¿Por qué un texto Biblica y no uno nuestro?',
      commissionH:'Encarga trabajo más profundo',
      cBasic:'Traducción analítica', cBasicSub:'Aparato analítico generado por IA — morfología, notas léxicas. Entrega en minutos.',
      cFull:'Traducción anotada', cFullSub:'Lectura + notas por capas generadas por IA. Entrega en minutos.',
      cBook:'Libro completo', cBookSub:'Encarga el libro entero en este idioma de una sola vez.',
      missingH:'Aún no tenemos Biblica ' + langName,
      missingB:'Biblica cubre ~40 idiomas puente. ' + langName + ' no está en ese corpus; no podemos mostrar el pasaje aquí. Encargar la traducción analítica producirá la primera versión de este pasaje en ' + langName + ' en The Amos Project.',
      eyebrow:'Perícopa · sin trabajo analítico todavía'
    },
    ca: {
      badge:'Cortesia de Biblica · visualització només de lectura',
      sub:'Encara no hi ha traducció analítica — aquí tens el text de referència de Biblica perquè el passatge es pugui llegir en ' + langName + '.',
      why:'Les traduccions d\u2019equivalència dinàmica com la NVI prioritzen la llegibilitat per sobre de la fidelitat gramatical. Són excel\u00b7lents per a la lectura devocional però no sostenen feina exegètica. Una traducció analítica donaria visibilitat de la gramàtica de la font, anàlisi de perícopa i cross-references.',
      whyH:'Per què un text Biblica i no un de nostre?',
      commissionH:'Encarrega més profunditat',
      cBasic:'Traducció analítica', cBasicSub:'Aparat analític generat per IA — morfologia, notes lèxiques. Lliurament en minuts.',
      cFull:'Traducció anotada', cFullSub:'Lectura + notes per capes generades per IA. Lliurament en minuts.',
      cBook:'Llibre sencer', cBookSub:'Encarrega el llibre sencer en aquest idioma d’una sola vegada.',
      missingH:'Encara no tenim Biblica ' + langName,
      missingB:'Biblica cobreix ~40 llengües pont. ' + langName + ' no hi és encara. Encarregar la traducció analítica produirà la primera versió d\u2019aquest passatge en ' + langName + ' a The Amos Project.',
      eyebrow:'Perícopa · sense treball analític encara'
    },
  };
  const chrome = chromeMap[I.getLang()] || chromeMap.en;

  return React.createElement(React.Fragment, null,
    React.createElement('div', {
      className: 'amos-drawer-backdrop ' + (open ? 'open' : ''),
      onClick: onClose
    }),
    React.createElement('aside', {
      className: 'amos-drawer ' + (open ? 'open' : '') + ' bib-mode'
    },
      // Shared drawer head
      React.createElement('div', { className: 'amos-drawer-head' },
        React.createElement('div', null,
          React.createElement('div', { className: 'amos-drawer-eyebrow' }, chrome.eyebrow),
          React.createElement('div', { className: 'amos-drawer-title' },
            refLabel,
            React.createElement('em', null, '  · ' + langName + ' · Biblica preview')
          )
        ),
        React.createElement('div', { className: 'amos-drawer-actions' },
          React.createElement('span', { className: 'bib-head-partner' },
            React.createElement('span', { className: 'bib-head-logo' },
            React.createElement('img', { src:(window.__resources && window.__resources.biblicaLogo) || 'assets/biblica-logo.png', alt:'Biblica' })
          ),
            'Biblica'
          ),
          React.createElement('button', {
            className: 'amos-icon-btn', onClick: onClose, 'aria-label':'Close'
          }, window.I.x(16))
        )
      ),

      // Body with same padding/typography as reader drawer
      React.createElement('div', { className: 'amos-drawer-body' },
        // Biblica courtesy strip (fits same language as ReferenceMediaStrip)
        React.createElement('div', { className: 'bib-strip' },
          React.createElement('span', { className: 'bib-strip-dot' }),
          React.createElement('span', { className: 'bib-strip-t' }, chrome.badge)
        ),

        React.createElement('div', { className: 'reader-ref' },
          (text ? text.title : refLabel).toUpperCase() + '  ·  BIBLICA · ' + langName
        ),

        React.createElement('p', { className: 'bib-sub' }, chrome.sub),

        text
          ? React.createElement('div', { className: 'reader-passage', style: { marginTop: 14 } },
              text.verses.map(v => React.createElement('div', { key: v.n, className: 'verse' },
                React.createElement('span', { className: 'v-num' }, v.n),
                v.t
              ))
            )
          : React.createElement('div', { className: 'bib-missing' },
              React.createElement('div', { className: 'bm-title' }, chrome.missingH),
              React.createElement('div', { className: 'bm-body' }, chrome.missingB)
            ),

        React.createElement('div', { className: 'bib-callout' },
          React.createElement('h6', null, chrome.whyH),
          React.createElement('p', null, chrome.why)
        ),

        React.createElement('div', { className: 'bib-commission' },
          React.createElement('h5', { className: 'bib-commission-h' }, chrome.commissionH),
          React.createElement('button', {
            className: 'bib-cta primary',
            onClick: () => setCommissionTarget({ kind:'ai', pericope: refLabel, mode: 'B', lang: coverLang })
          },
            React.createElement('div', { className: 'cta-body' },
              React.createElement('div', { className: 'cta-t' }, chrome.cBasic),
              React.createElement('div', { className: 'cta-s' }, chrome.cBasicSub)
            ),
            React.createElement('div', { className: 'cta-ar' }, '→')
          ),
          React.createElement('button', {
            className: 'bib-cta',
            onClick: () => setCommissionTarget({ kind:'ai', pericope: refLabel, mode: 'D', lang: coverLang })
          },
            React.createElement('div', { className: 'cta-body' },
              React.createElement('div', { className: 'cta-t' }, chrome.cFull),
              React.createElement('div', { className: 'cta-s' }, chrome.cFullSub)
            ),
            React.createElement('div', { className: 'cta-ar' }, '→')
          ),
          React.createElement('button', {
            className: 'bib-cta',
            onClick: () => onCommission && onCommission({
              whole: true,
              book: p.book,
              ref: (p.ref || '').split(' ').slice(0, -1).join(' ') || p.book,
              targetLang: coverLang
            })
          },
            React.createElement('div', { className: 'cta-body' },
              React.createElement('div', { className: 'cta-t' }, chrome.cBook),
              React.createElement('div', { className: 'cta-s' }, chrome.cBookSub)
            ),
            React.createElement('div', { className: 'cta-ar' }, '→')
          )
        )
      )
    ),
    commissionTarget && window.PericopeCommissionModal && React.createElement(window.PericopeCommissionModal, {
      target: commissionTarget,
      onClose: () => setCommissionTarget(null),
      onSubmit: () => setCommissionTarget(null)
    })
  );
}

Object.assign(window, { BiblicaDrawer });