Feat/BOOK-240 hero video

Approved-by: Chuma Mcphoy (We Ahead)
Approved-by: Christel Westerberg

packages/design-system/lib/components/VideoPlayer/index.tsx

@@ -22,6 +22,7 @@ interface VideoPlayerProps extends VariantProps<typeof variants> {
   captions?: Caption[]
   focalPoint?: FocalPoint
   autoPlay?: boolean
+  hasOverlay?: boolean
 }
 
 export function VideoPlayer({
@@ -31,6 +32,7 @@ export function VideoPlayer({
   className,
   variant = 'inline',
   autoPlay,
+  hasOverlay,
 }: VideoPlayerProps) {
   const intl = useIntl()
   const videoRef = useRef<HTMLVideoElement>(null)
@@ -84,7 +86,13 @@ export function VideoPlayer({
   const showMuteButton = variant === 'inline' && isActivated
 
   return (
-    <div className={cx(classNames, { [styles.isActivated]: isActivated })}>
+    <div
+      className={cx(
+        classNames,
+        { [styles.isActivated]: isActivated },
+        { [styles.hasOverlay]: hasOverlay }
+      )}
+    >
       <video
         ref={videoRef}
         className={styles.video}