// EmailGate — reveals gated findings after an email is submitted.
function EmailGate({ hiddenCount, onSubmit, submitted }) {
  const { React } = window;
  const [email, setEmail] = React.useState('');
  const [touched, setTouched] = React.useState(false);
  const valid = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
  if (submitted) return null;
  return (
    <div className="email-gate">
      <div className="eg-inner">
        <div className="eg-title">
          <span className="eg-lock">⏿</span>
          <span>{hiddenCount} more findings + full report</span>
        </div>
        <div className="eg-sub">
          enter your email and we'll send the sarif + html report. no drip, no list.
        </div>
        <form className="eg-form" onSubmit={(e) => { e.preventDefault(); if (valid) onSubmit(email); }}>
          <input
            type="email" placeholder="you@work.com"
            value={email} onChange={(e) => setEmail(e.target.value)}
            onBlur={() => setTouched(true)} />
          <button type="submit" disabled={!valid} className={valid ? 'is-valid' : ''}>
            send me the full report →
          </button>
        </form>
        {touched && !valid && <div className="eg-error">use a valid email</div>}
      </div>
    </div>
  );
}
window.EmailGate = EmailGate;