title: React-Bootstrap Toggle Button is Failing to Hide the Radio Button Circle
body: <p>In my form, I want toggle buttons. The following code is copied from react-bootstrap docs on toggle buttons. However, the radio-button circles are displaying when they should be hidden. How do I hide them?</p>
  <pre><code>import ButtonGroup from 'react-bootstrap/ButtonGroup'
  import ToggleButton from 'react-bootstrap/ToggleButton
  </code></pre>
  <p>'</p>
  <pre><code>&lt;ButtonGroup&gt;
     {radios.map((radio, idx) =&gt; (
      &lt;ToggleButton
       key={idx}
       id={`radio-${idx}`}
       type=&quot;radio&quot;
       variant={idx % 2 ? 'outline-success' : 'outline-danger'}
       name=&quot;radio&quot;
       value={radio.value}
       checked={radioValue === radio.value}
       onChange={(e) =&gt; setRadioValue(e.currentTarget.value)}
                                      &gt;
       {radio.name}
      &lt;/ToggleButton&gt;
        ))}
   &lt;/ButtonGroup&gt;
  </code></pre>