// js/components/common/ConfirmDeleteModal.jsx
// Modal de confirmação de exclusão — React.createElement (sem JSX direto).
// Movido de index.html em Fase 5 do refactor (2026-04-29): L652-L713
// Nota: usa React.useEffect e React.createElement explicitamente (sem destructuring necessário).
(function() {
  'use strict';

  // CÓPIA EXATA do index.html L652-L713
  function ConfirmDeleteModal({ show, title, message, detail, onConfirm, onCancel }) {
    if (!show) return null;
    React.useEffect(() => {
      const handleEsc = (e) => { if (e.key === 'Escape') onCancel(); };
      document.addEventListener('keydown', handleEsc);
      return () => document.removeEventListener('keydown', handleEsc);
    }, [onCancel]);
    return React.createElement('div', {
      style: {
        position: 'fixed', top: 0, left: 0, right: 0, bottom: 0,
        backgroundColor: 'rgba(0,0,0,0.5)',
        display: 'flex', alignItems: 'center', justifyContent: 'center',
        zIndex: 10000
      },
      onClick: onCancel
    },
      React.createElement('div', {
        style: {
          background: '#fff', borderRadius: '12px', padding: '24px',
          maxWidth: '420px', width: '90%', textAlign: 'center',
          boxShadow: '0 20px 60px rgba(0,0,0,0.3)'
        },
        onClick: (e) => e.stopPropagation()
      },
        React.createElement('div', { style: { fontSize: '48px', marginBottom: '12px' } }, '⚠️'),
        React.createElement('h3', { style: { margin: '0 0 8px', fontSize: '18px', color: '#1B2A4A' } }, title || 'Confirmar Exclusão'),
        React.createElement('p', { style: { margin: '0 0 4px', fontSize: '15px', color: '#333' } }, message),
        detail ? React.createElement('p', { style: { margin: '0 0 16px', fontSize: '13px', color: '#888' } }, detail)
               : React.createElement('div', { style: { marginBottom: '16px' } }),
        React.createElement('div', { style: { display: 'flex', gap: '12px', justifyContent: 'center' } },
          React.createElement('button', {
            autoFocus: true,
            onClick: onCancel,
            style: {
              padding: '10px 24px', borderRadius: '8px', border: '1px solid #ddd',
              background: '#f5f5f5', color: '#333', fontSize: '14px', fontWeight: '600',
              cursor: 'pointer', minWidth: '100px'
            }
          }, 'Cancelar'),
          React.createElement('button', {
            onClick: onConfirm,
            style: {
              padding: '10px 24px', borderRadius: '8px', border: 'none',
              background: '#DC2626', color: '#fff', fontSize: '14px', fontWeight: '600',
              cursor: 'pointer', minWidth: '100px'
            }
          }, 'Excluir')
        )
      )
    );
  }

  window.ZNX = window.ZNX || {};
  window.ZNX.components = window.ZNX.components || {};
  window.ZNX.components.ConfirmDeleteModal = ConfirmDeleteModal;
  window.ConfirmDeleteModal = ConfirmDeleteModal;

  window.ZNX.refactor_phase_5_loaded = window.ZNX.refactor_phase_5_loaded || {};
  window.ZNX.refactor_phase_5_loaded.ConfirmDeleteModal = true;

})();
