Commits on Jan 14, 2022

1. fix(material/sidenav): end position sidenav tab order not matching vi… …

   …sual order
   
   We project all sidenavs before the content in the DOM since we can't know ahead of time what their
   position will be. This is problematic when the drawer is in the end position, because the visual
   order of the content no longer matches the tab order. These changes fix the issue by moving the
   sidenav after the content manually when it's set to `end` and then moving it back if it's set to
   `start` again.
   
   A couple of notes:
   1. We could technically do this with content projection, but it would only work when the `position`
   value is static (e.g. `position="end"`). I did it this way so we can cover the case where it's
   data bound.
   2. Currently the focus trap anchors are set around the sidenav, but that's problematic when we're
   moving the element around since the anchors will be left at their old positions. To avoid adding
   extra logic for moving the anchors, I've moved the focus trap to be inside the sidenav. Here's
   what the DOM looks like at the moment:
   
   ```html
   <container>
     <anchor/>
     <sidenav>Content</sidenav>
     <anchor/>
   </container>
   ```
   
   And this is what I've changed it to:
   ```html
   <container>
     <sidenav>
       <anchor/>
       Content
       <anchor/>
     </sidenav>
   </container
   ```
   
   Fixes angular#15247.

   

   crisbeto committed Jan 14, 2022
   Configuration menu

   • View commit details
   • Copy full SHA for eae6680
   • Browse repository at this point

   Copy the full SHA

   eae6680 View commit details

   Browse the repository at this point in the history