почему mat-sidenav не меняет свой размер, если контент - это кнопка, а не ссылка?

Question

Я создаю sidenav, и у меня будет размер, адаптированный к содержанию mat-list-item. Версия, использующая кнопку, не работает, ее размер слишком мал, поскольку текст кнопки не используется. Если я перейду на якорь, размер sidenav будет таким, как ожидалось.

Есть ли объяснение, как это работает?

NOK

<mat-list-item (click)="onClose()">
   <button mat-icon-button (click)="onAdd()">
      <mat-icon>add_circle</mat-icon>
      <span class="nav-caption" fxHide.xs>add</span>
   </button>
</mat-list-item>

OK

<a (click)="onAdd();onClose()" href="#" mat-list-item>
    <mat-icon>add_circle</mat-icon>
    <span class="nav-caption" fxHide.xs>add</span></a>

Спасибо за советы