// js/components/widgets/comissao-admin/CommissionAdminHeader.jsx
// [Wave 36 v224.17 NUCLEAR EXTRACT 2026-05-24] Header com title + selects + buttons
// Extract LITERAL ComissaoAdmin L161-178
//
// Props:
//   - month, year (numbers), setMonth, setYear (fns)
//   - merged (array) — pra count "X vendedoras"
//   - onReload (fn) — reload handler (preservado LITERAL no main)
//   - onCloseMonth (fn) — closeMonth handler (preservado LITERAL no main)
//   - closing (bool) — _closingRef.current pra disabled botão
//
// Deps lazy: ZNX.lib['comissao-admin'].calcs.monthName
(function(){
  'use strict';
  function CommissionAdminHeader(props){
    const calcs = window.ZNX && window.ZNX.lib && window.ZNX.lib['comissao-admin'] && window.ZNX.lib['comissao-admin'].calcs;
    if(!calcs){
      console.error('[CommissionAdminHeader] calcs lib ausente');
      return null;
    }
    const { month, year, setMonth, setYear, merged, onReload, onCloseMonth, closing } = props;
    return (
      <div style={{display:'flex',justifyContent:'space-between',alignItems:'center',flexWrap:'wrap',gap:10}}>
        <div>
          <div style={{fontSize:18,fontWeight:800,color:'#1B2A4A',letterSpacing:'-0.02em'}}>💰 Comissões — Painel Admin</div>
          <div style={{fontSize:12,color:'#6B7280',marginTop:2}}>{merged.length} vendedoras · Bate meta = 1% · Senão = 0.5%</div>
        </div>
        <div style={{display:'flex',gap:6,alignItems:'center'}}>
          <select value={month} onChange={function(e){setMonth(Number(e.target.value));}} style={{padding:'6px 10px',borderRadius:6,border:'1px solid #D1D5DB',fontSize:13}}>
            {[1,2,3,4,5,6,7,8,9,10,11,12].map(function(m){return <option key={m} value={m}>{calcs.monthName(m)}</option>;})}
          </select>
          <select value={year} onChange={function(e){setYear(Number(e.target.value));}} style={{padding:'6px 10px',borderRadius:6,border:'1px solid #D1D5DB',fontSize:13}}>
            {[2026,2025,2024].map(function(y){return <option key={y} value={y}>{y}</option>;})}
          </select>
          <button className="btn-outline btn-sm" onClick={onReload}>🔄</button>
          <button className="btn-gold btn-sm" onClick={onCloseMonth} disabled={closing}>
            {closing ? '⏳' : '🔒 Fechar mês'}
          </button>
        </div>
      </div>
    );
  }
  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets['comissao-admin'] = window.ZNX.widgets['comissao-admin'] || {};
  window.ZNX.widgets['comissao-admin'].CommissionAdminHeader = CommissionAdminHeader;
  // [Wave 36 marker v224.17] confirma CommissionAdminHeader executado
  window.CommissionAdminHeader_v224_17_wave36 = true;
})();