<.swap >
  <:swap_on name="ON" />
  <:swap_off name="OFF" />
</.swap>

<.swap >
  <:swap_on type="icon" name="hero-speaker-wave" />
  <:swap_off type="icon" name="hero-speaker-x-mark" />
</.swap>

<.swap animation="rotate">
  <:swap_on type="icon" name="hero-sun" />
  <:swap_off type="icon" name="hero-moon" />
</.swap>

<.swap animation="flip">
  <:swap_on name="😈" />
  <:swap_off name="😇" />
</.swap>

<.swap animation="rotate">
  <:swap_on type="icon" name="hero-x-mark" />
  <:swap_off type="icon" name="hero-bars-3" />
</.swap>