fix: add workaround for issue with restoreel option in video.js

Added a div container to ensure that the parent of the element passed to video.js is not
the shadow root directly. This workaround resolves the issue until a permanent fix is
implemented in video-js, see: videojs/video.js#8679

src/components/preview-box.js

@@ -1,4 +1,4 @@
-import { html, LitElement } from 'lit';
+import { css, html, LitElement } from 'lit';
 import pillarbox from '@srgssr/pillarbox-web';
 
 /**
@@ -22,19 +22,29 @@ class PreviewBox extends LitElement {
  type: { type: String }
  };
 
+ static styles = css`
+ .player-container {
+ width: 100%;
+ height: 100%;
+ }
+ `;
+
  constructor() {
  super();
  this.src = 'urn:rts:video:14318206';
  this.type = 'srgssr/urn';
  }
 
  render() {
+ // TODO Remove the player container once this is resolved: https://github.com/videojs/video.js/pull/8679
  return html`
  <style>${this.appliedCss}</style>
- <video id="preview-player"
- class="pillarbox-js"
- controls crossOrigin="anonymous">
- </video>
+ <div class="player-container">
+ <video id="preview-player"
+ class="pillarbox-js"
+ controls crossOrigin="anonymous">
+ </video>
+ </div>
  `;
  }