From 782a5a1e794a9a8ef6b0b892cd3f386ed583c680 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Fri, 22 Apr 2022 18:56:32 +0200 Subject: chore: add a SectionedLayout component --- .../sectioned/sectioned-layout.stories.tsx | 68 ++++++++++++++++++++++ 1 file changed, 68 insertions(+) create mode 100644 src/components/templates/sectioned/sectioned-layout.stories.tsx (limited to 'src/components/templates/sectioned/sectioned-layout.stories.tsx') diff --git a/src/components/templates/sectioned/sectioned-layout.stories.tsx b/src/components/templates/sectioned/sectioned-layout.stories.tsx new file mode 100644 index 0000000..9ff3b75 --- /dev/null +++ b/src/components/templates/sectioned/sectioned-layout.stories.tsx @@ -0,0 +1,68 @@ +import { ComponentMeta, ComponentStory } from '@storybook/react'; +import { IntlProvider } from 'react-intl'; +import SectionedLayoutComponent from './sectioned-layout'; + +/** + * SectionedLayout - Storybook Meta + */ +export default { + title: 'Templates/Sectioned', + component: SectionedLayoutComponent, + argTypes: { + sections: { + description: 'The different sections.', + type: { + name: 'object', + required: true, + value: {}, + }, + }, + }, + decorators: [ + (Story) => ( + +
+ +
+
+ ), + ], + parameters: { + layout: 'fullscreen', + }, +} as ComponentMeta; + +const Template: ComponentStory = (args) => ( + +); + +const sections = [ + { + title: 'Section 1', + content: + 'Qui suscipit ea et aut dicta. Quia ut dignissimos. Sapiente beatae voluptatem quis et. Nemo vitae magni. Nihil iste officia est sed esse molestiae doloribus. Quia temporibus nobis ea fuga quis incidunt doloribus eaque.', + }, + { + title: 'Section 2', + content: + 'Reprehenderit aut magnam ut quos. Voluptatibus beatae et. Earum non atque voluptatum illum rem distinctio repellat.', + }, + { + title: 'Section 3', + content: + 'Placeat rem dolores dolore illum earum officia dolore. Ut est ducimus. Officia eveniet pariatur ut laboriosam voluptatibus aut doloremque natus quis.', + }, + { + title: 'Section 4', + content: + 'Vitae facere ipsa eum sunt debitis veritatis dolorem labore qui. Dolores recusandae omnis aut. Repudiandae quia neque porro in blanditiis. A atque minima fugit. Totam quidem voluptas natus velit at.', + }, +]; + +/** + * Sectioned Layout Stories - Default + */ +export const Sectioned = Template.bind({}); +Sectioned.args = { + sections, +}; -- cgit v1.2.3