Feat/BOOK-240 hero video

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

apps/scandic-web/components/Hero/index.tsx

@@ -1,25 +1,25 @@
+import { cx } from "class-variance-authority"
+
 import Image from "@scandic-hotels/design-system/Image"
 
 import styles from "./hero.module.css"
 
-import type { HeroProps } from "./hero"
+import type { ComponentProps } from "react"
 
-export default async function Hero({
-  alt,
-  src,
-  focalPoint,
-  dimensions,
-}: HeroProps) {
+type HeroProps = Pick<
+  ComponentProps<typeof Image>,
+  "className" | "alt" | "src" | "focalPoint" | "dimensions"
+>
+
+export default async function Hero({ className, alt, ...props }: HeroProps) {
   return (
     <Image
-      className={styles.hero}
+      className={cx(styles.hero, className)}
       alt={alt}
       height={480}
       width={1196}
-      src={src}
-      focalPoint={focalPoint}
-      dimensions={dimensions}
       priority
+      {...props}
     />
   )
 }