diff options
Diffstat (limited to 'src/components/molecules/layout/flipping-logo.stories.tsx')
| -rw-r--r-- | src/components/molecules/layout/flipping-logo.stories.tsx | 66 |
1 files changed, 66 insertions, 0 deletions
diff --git a/src/components/molecules/layout/flipping-logo.stories.tsx b/src/components/molecules/layout/flipping-logo.stories.tsx new file mode 100644 index 0000000..1ac8de8 --- /dev/null +++ b/src/components/molecules/layout/flipping-logo.stories.tsx @@ -0,0 +1,66 @@ +import { ComponentMeta, ComponentStory } from '@storybook/react'; +import FlippingLogoComponent from './flipping-logo'; + +export default { + title: 'Molecules/Layout', + component: FlippingLogoComponent, + argTypes: { + altText: { + control: { + type: 'text', + }, + description: 'Photo alternative text.', + type: { + name: 'string', + required: true, + }, + }, + className: { + control: { + type: 'text', + }, + description: 'Set additional classnames to the logo wrapper.', + table: { + category: 'Options', + }, + type: { + name: 'string', + required: false, + }, + }, + logoTitle: { + control: { + type: 'text', + }, + description: 'An accessible name for the logo.', + table: { + category: 'Accessibility', + }, + type: { + name: 'string', + required: false, + }, + }, + photo: { + control: { + type: 'text', + }, + description: 'Photo url.', + type: { + name: 'string', + required: true, + }, + }, + }, +} as ComponentMeta<typeof FlippingLogoComponent>; + +const Template: ComponentStory<typeof FlippingLogoComponent> = (args) => ( + <FlippingLogoComponent {...args} /> +); + +export const FlippingLogo = Template.bind({}); +FlippingLogo.args = { + altText: 'Website picture', + logoTitle: 'Website logo', + photo: 'http://placeimg.com/640/480', +}; |
