aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/molecules/layout/meta.stories.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/molecules/layout/meta.stories.tsx')
-rw-r--r--src/components/molecules/layout/meta.stories.tsx57
1 files changed, 35 insertions, 22 deletions
diff --git a/src/components/molecules/layout/meta.stories.tsx b/src/components/molecules/layout/meta.stories.tsx
index 0323f90..a1755a0 100644
--- a/src/components/molecules/layout/meta.stories.tsx
+++ b/src/components/molecules/layout/meta.stories.tsx
@@ -1,5 +1,5 @@
import { ComponentMeta, ComponentStory } from '@storybook/react';
-import MetaComponent from './meta';
+import MetaComponent, { MetaData } from './meta';
/**
* Meta - Storybook Meta
@@ -8,25 +8,41 @@ export default {
title: 'Molecules/Layout',
component: MetaComponent,
argTypes: {
- className: {
+ data: {
+ description: 'The page metadata.',
+ type: {
+ name: 'object',
+ required: true,
+ value: {},
+ },
+ },
+ itemsLayout: {
control: {
- type: 'text',
+ type: 'select',
},
- description: 'Set additional classnames to the meta wrapper.',
+ description: 'The items layout.',
+ options: ['inline', 'inline-values', 'stacked'],
table: {
- category: 'Styles',
+ category: 'Options',
+ defaultValue: { summary: 'inline-values' },
},
type: {
name: 'string',
required: false,
},
},
- data: {
- description: 'The page metadata.',
+ withSeparator: {
+ control: {
+ type: 'boolean',
+ },
+ description: 'Add a slash as separator between multiple values.',
+ table: {
+ category: 'Options',
+ defaultValue: { summary: true },
+ },
type: {
- name: 'object',
+ name: 'boolean',
required: true,
- value: {},
},
},
},
@@ -36,19 +52,16 @@ const Template: ComponentStory<typeof MetaComponent> = (args) => (
<MetaComponent {...args} />
);
-const data = {
- publication: { name: 'Published on:', value: 'April 9th 2022' },
- categories: {
- name: 'Categories:',
- value: [
- <a key="category1" href="#">
- Category 1
- </a>,
- <a key="category2" href="#">
- Category 2
- </a>,
- ],
- },
+const data: MetaData = {
+ publication: { date: '2022-04-09', time: '01:04:00' },
+ thematics: [
+ <a key="category1" href="#">
+ Category 1
+ </a>,
+ <a key="category2" href="#">
+ Category 2
+ </a>,
+ ],
};
/**