Sidebar toggle - improve UX

This was first brought up in https://github.com/rstudio/bslib/pull/798#issuecomment-1760890330 and 2.5 years later it still really bugs me, so I wanted to bring it up again :)

When the sidebar is open

I find it odd that the toggle takes up vertical space that renders everything else on the row useless. It has two major drawbacks IMO: (1) taking up valuable real estate, and (2) visually it does not look good to have an empty row with a small arrow above the beginning of the sidebar.

I've looked at dozens of websites and apps to see their sidebars, and I haven't encountered a single one that gives the small toggle handle its own row.

I understand why it was done, because if I have, for example, an accordion as the first item in a sidebar, then the two arrows would clash. But there are many sidebars that have a title or some other element at the top that would be perfectly happy to share that space. I have added CSS manually to change the top-padding of the sidebar to fix this, but I would really like this issue to be reconsidered by the team, perhaps a way to let people easily choose a different type of sidebar toggle.

When the sidebar is closed

In the closed state, I also feel that it looks strange to have a small arrow take up the entire column. It looks weird to me aesthetically that all the content gets pushed to the right, and there is essentially just empty space next to it, except a small arrow on top.

I appreciate the difficulty in making a design that would work on all devices and in all scenarios, which is probably why you didn't choose to go with a "floating" button, because it may interfere with the content.

My suggestion is to allow the user to choose whether to keep the current behaviour, or to be able to provide a "collapsed" sidebar state. Something like these designs https://dribbble.com/search/collapse-sidebar ; it doesn't need to take up any more horizontal space than the current collapsed state, but instead of having pure whitespace from top to bottom, it can have some content. Most likely it would be icons. I haven't fully thought this out, but I do think there is merit to this and it should be explored.

Start by reading the existing sidebar toggle behavior and the linked discussion in pull request 798. Compare the open and closed states described here, then clarify a concrete toggle design and acceptance criteria with the maintainers before implementation.