// js/components/widgets/PeriodFilterBar.jsx
// [REFACTOR Wave 3.5 PFB — 2026-05-15] Unify 2 PeriodFilterBar duplicates byte-by-byte:
// - widgets/Marcas.jsx L170-194 (def DELETED)
// - widgets/marcas/FichaMarca.jsx L163-187 (def DELETED — era cópia Wave 2 P3 Strategy A embedded)
// Body literal sem mudança lógica. Path A hex hardcode inline.
// Consumers: Marcas (caller L384 wrapped isAdmin) + FichaMarca (caller L395 dentro modal).
(function() {
  'use strict';

  function PeriodFilterBar({period,setPeriod,customStart,setCustomStart,customEnd,setCustomEnd}){
    const opts=[
      {v:'all',l:'Tudo'},{v:'today',l:'Hoje'},{v:'7d',l:'7d'},
      {v:'30d',l:'30d'},{v:'month',l:'Este mês'},{v:'year',l:'Este ano'},
      {v:'custom',l:'Personalizado'}
    ];
    return(
      <div style={{display:'flex',gap:8,alignItems:'center',flexWrap:'wrap',marginBottom:14}}>
        <span style={{fontSize:11,color:'#9CA3AF',fontWeight:700,textTransform:'uppercase',letterSpacing:1}}>Período:</span>
        {opts.map(o=>(
          <button key={o.v} onClick={()=>setPeriod(o.v)}
            style={{padding:'6px 12px',borderRadius:8,border:'1.5px solid '+(period===o.v?'#B89840':'#E4E7EC'),background:period===o.v?'#FEF9E7':'#fff',color:period===o.v?'#1B2A4A':'#6B7280',fontWeight:period===o.v?700:500,fontSize:12,cursor:'pointer'}}>
            {o.l}
          </button>
        ))}
        {period==='custom'&&(
          <>
            <input type="date" value={customStart} onChange={e=>setCustomStart(e.target.value)} style={{padding:'5px 8px',borderRadius:6,border:'1.5px solid #E4E7EC',fontSize:12}}/>
            <span style={{color:'#9CA3AF'}}>até</span>
            <input type="date" value={customEnd} onChange={e=>setCustomEnd(e.target.value)} style={{padding:'5px 8px',borderRadius:6,border:'1.5px solid #E4E7EC',fontSize:12}}/>
          </>
        )}
      </div>
    );
  }

  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets.PeriodFilterBar = PeriodFilterBar;
})();
