Alter border radius of RoomSublist buttons to reflect shape of other buttons in room list.
Add background color on hover to RoomSublist buttons to provide more visual feedback.
In the style shuffle of https://github.com/matrix-org/matrix-react-sdk/pull/5970 the playback bar got squished up against the send button. This just fixes the selector to actually hit the composer-based recorder all the time, not just when recording.
This all started with a bug where the clock wouldn't update appropriately, and ended with a whole refactoring to support later playback in the timeline.
Playback and recording instances are now independent, and this applies to the <Playback* /> components as well. Instead of those playback components taking a recording, they take a playback instance which has all the information the components need.
The clock was incredibly difficult to do because of the audio context's time tracking and the source's inability to say where it is at in the buffer/in time. This means we have to track when we started playing the clip so we can capture the audio context's current time, which may be a few seconds by the first time the user hits play. We also track stops so we know when to reset that flag.
Waveform calculations have also been moved into the base component, deduplicating the math a bit.
There was a line of CSS that set pointer-events: none on widget
iframes whilst they were being resized to stop iframes swallowing
the mousemove/up events while dragging the resize handle, but a)
all widgets are now in a persisted element wrapper and therefore
not in the right place in the DOM to get that CSS and b) that only
got set when resizing the whole aps drawer vertically, not dragging
the handle between apps to change the width distribution.
Add a pointer events prop to AppTile to allow the pointer-events
style to be set by the parent, and set it when dragging either
resize handle.
Fixes https://github.com/vector-im/element-web/issues/16473
