Svg use tag wrongly formatted

[kuon]

The following snippet:

 <div phx-click="toggle_password"
        phx-hook="focus"
        id="toggle_password"
        data-focus="credentials_password"
        class="absolute right-0 top-0 py-1 px-2 bg-gray-900 h-8 flex items-center">
        <svg height="24px"
          width="24px"
          viewBox="0 0 100 100">
          <%= if @show_password do %>
          <use href="/icons/eye_crossed.svg#icon"></use>
          <% else %>
          <use href="/icons/eye.svg#icon"></use>
          <% end %>
        </svg>
      </div>

gets formatted to

<div
  phx-click="toggle_password"
  phx-hook="focus"
  id="toggle_password"
  data-focus="credentials_password"
  class="absolute right-0 top-0 py-1 px-2 bg-gray-900 h-8 flex items-center"
>
  <svg height="24px" width="24px" viewBox="0 0 100 100">
    <%= if @show_password do %>
      <use href="/icons/eye_crossed.svg#icon"></use>

    <% else %>
      <usehref="/icons/eye.svg#icon"></use>
    <% end %>
  </svg>
</div>

The use tag is altered to usehref and there is a newline inserted before the else.

[email protected]
[email protected]

Erlang/OTP 24 [erts-12.0] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] [jit]

Elixir 1.12.1 (compiled with Erlang/OTP 24)