BottomAppBar menu items in wrong position

Question

the menu items are shown behind the FAB how to show menu items at the opposite side ?

<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomappbar.BottomAppBar
  android:id="@+id/bar"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom"
  app:fabAlignmentMode="end"
  app:navigationIcon="@drawable/list"/>

 <com.google.android.material.floatingactionbutton.FloatingActionButton
  android:id="@+id/fab"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:src="@drawable/messages"
  app:layout_anchor="@id/bar"/>

</android.support.design.widget.CoordinatorLayout>