Merged in feat/sw-3244-move-imagecontainer-to-design-system (pull request #2637)

feat(SW-3244): Move ImageContainer component to design-system * Move ImageContainer component to design-system * Fix imports Approved-by: Bianca Widstam
2025-08-13 14:37:29 +00:00
parent e3067331c6
commit cd29e54098
6 changed files with 24 additions and 12 deletions
--- a/packages/design-system/lib/components/ImageContainer/index.tsx
+++ b/packages/design-system/lib/components/ImageContainer/index.tsx
@@ -0,0 +1,55 @@
+import Caption from '../Caption'
+import Image from '../Image'
+
+import styles from './imageContainer.module.css'
+
+type Image = {
+  id: number
+  title: string
+  url: string
+  focalPoint: {
+    x: number
+    y: number
+  }
+  meta: {
+    alt?: string | null
+    caption?: string | null
+  }
+}
+
+type ImageContainerProps = {
+  leftImage: Image
+  rightImage: Image
+}
+
+export default function ImageContainer({
+  leftImage,
+  rightImage,
+}: ImageContainerProps) {
+  return (
+    <section className={styles.container}>
+      <article>
+        <Image
+          className={styles.image}
+          src={leftImage.url}
+          height={365}
+          width={600}
+          alt={leftImage.meta.alt || leftImage.title}
+          focalPoint={leftImage.focalPoint}
+        />
+        <Caption>{leftImage.meta.caption}</Caption>
+      </article>
+      <article>
+        <Image
+          className={styles.image}
+          src={rightImage.url}
+          height={365}
+          width={600}
+          alt={rightImage.meta.alt || rightImage.title}
+          focalPoint={rightImage.focalPoint}
+        />
+        <Caption>{leftImage.meta.caption}</Caption>
+      </article>
+    </section>
+  )
+}