List story children as array

Amsterdam · Dec 22, 2023 · b9be0d3 · b9be0d3
1 parent eeb24d1
commit b9be0d3
Showing 1 changed file with 19 additions and 21 deletions.
diff --git a/storybook/storybook-react/src/Overlap/Overlap.stories.tsx b/storybook/storybook-react/src/Overlap/Overlap.stories.tsx
@@ -24,26 +24,24 @@ type Story = StoryObj<typeof meta>
 
 export const Default: Story = {
   args: {
-    children: (
-      <>
-        <AspectRatio ratio="2x-wide">
-          <Image
-            alt=""
-            cover
-            sizes="(max-width: 36rem) 640px, (max-width: 68rem) 1280px, 1600px"
-            src="https://picsum.photos/640/180"
-            srcSet="https://picsum.photos/640/180 640w, https://picsum.photos/1280/360 1280w, https://picsum.photos/1600/450 1600w"
-          />
-        </AspectRatio>
-        <Grid style={{ alignSelf: 'center' }}>
-          <Grid.Cell span={{ narrow: 4, medium: 6, wide: 8 }} start={{ narrow: 1, medium: 2, wide: 3 }}>
-            <SearchField onSubmit={(e) => e.preventDefault()}>
-              <SearchField.Input label="Zoeken" placeholder="Wat kunnen we voor u vinden?" />
-              <SearchField.Button />
-            </SearchField>
-          </Grid.Cell>
-        </Grid>
-      </>
-    ),
+    children: [
+      <AspectRatio key="background-image" ratio="2x-wide">
+        <Image
+          alt=""
+          cover
+          sizes="(max-width: 36rem) 640px, (max-width: 68rem) 1280px, 1600px"
+          src="https://picsum.photos/640/180"
+          srcSet="https://picsum.photos/640/180 640w, https://picsum.photos/1280/360 1280w, https://picsum.photos/1600/450 1600w"
+        />
+      </AspectRatio>,
+      <Grid key="search-field" style={{ alignSelf: 'center' }}>
+        <Grid.Cell span={{ narrow: 4, medium: 6, wide: 8 }} start={{ narrow: 1, medium: 2, wide: 3 }}>
+          <SearchField onSubmit={(e) => e.preventDefault()}>
+            <SearchField.Input label="Zoeken" placeholder="Wat kunnen we voor u vinden?" />
+            <SearchField.Button />
+          </SearchField>
+        </Grid.Cell>
+      </Grid>,
+    ],
   },
 }