blob: 36ca039c9409a0b1291b3d0bba8182d53e77ffcf (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
|
import Section, {
type SectionProps,
type SectionVariant,
} from '@components/atoms/layout/section';
import { FC } from 'react';
import Layout from '../layout/layout';
export type Section = Pick<SectionProps, 'content' | 'title'>;
export type SectionedLayoutProps = {
/**
* An array of objects describing each section.
*/
sections: Section[];
};
/**
* SectionedLayout component
*
* Render a sectioned layout.
*/
const SectionedLayout: FC<SectionedLayoutProps> = ({ sections }) => {
const getSections = (items: SectionProps[]) => {
return items.map((section, index) => {
const variant: SectionVariant = index % 2 ? 'light' : 'dark';
const isLastSection = index === items.length - 1;
return (
<Section
key={`section-${index}`}
title={section.title}
content={section.content}
variant={variant}
withBorder={!isLastSection}
/>
);
});
};
return <Layout>{getSections(sections)}</Layout>;
};
export default SectionedLayout;
|
