Use With FluentAvalonia IconSource

[Ricent82]

Could you maybe provide some sample code for how to use these icons with FluentAvalonia's IconSource? I've so far been unable to get it to work. As a quick example, here's their NavigationView control (from the sample project):

You specify the items like:

<ui:NavigationViewItem.MenuItems>
    <ui:NavigationViewItem Content="Mail" IconSource="Mail" />
</ui:NavigationViewItem.MenuItems>

Rather than their selection of icons, I'd love to be able to use these. I tried something like:

      <ui:NavigationView.MenuItemTemplate>
        <DataTemplate>
          <ui:NavigationViewItem>
            <StackPanel Orientation="Horizontal">
              <i:Icon Value="fa-brands fa-anchor"/>
              <TextBlock Text="Anchor" />
            </StackPanel>
          </ui:NavigationViewItem>
        </DataTemplate>
      </ui:NavigationView.MenuItemTemplate>

But then you end up having to tweak around with margins - and it still looks glitchy when you expand/collapse the item:

I'm sure there must be a simple way to do this, but I haven't found any way that's compatible. Any pointers would be greatly appreciated. Here's a bit about their IconSource, if it's helpful: https://github.com/amwx/FluentAvalonia/pull/257