feat: add missing stories (#335)

* feat: add missing stories

* fix: figma links and removes console log
This commit is contained in:
marcelines 2023-01-25 11:21:32 +00:00 committed by GitHub
parent a1c559b6ae
commit fe31f2f59c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 153 additions and 0 deletions

View File

@ -0,0 +1,76 @@
import { Basketball, Collaboration, Play, Unicorn } from '../emoji'
import { Accordion } from './accordion'
import { AccordionItem } from './accordionItem'
import type { Meta, StoryObj } from '@storybook/react'
const meta: Meta<typeof Accordion> = {
component: Accordion,
argTypes: {},
args: {
numberOfNewMessages: 3,
title: 'Welcome',
},
parameters: {
design: {
type: 'figma',
url: 'https://www.figma.com/file/IBmFKgGL1B4GzqD8LQTw6n/Design-System-for-Web?node-id=14849%3A172544&t=4BeIzudVkio0c6Px-4',
},
},
}
type Story = StoryObj<typeof Accordion>
export const Default: Story = {
args: {
children: (
<>
<AccordionItem
key="welcome"
icon={<Unicorn hasBackground />}
title={'# welcome'}
channelStatus="withMessages"
numberOfMessages={1}
isSelected
onPress={() => {
// do nothing
}}
/>
<AccordionItem
key="general"
icon={<Basketball hasBackground />}
title={'# general'}
channelStatus="withMentions"
numberOfMessages={2}
onPress={() => {
// do nothing
}}
mb={8}
/>
<AccordionItem
key="lounge"
icon={<Collaboration hasBackground />}
title={'# lounge'}
numberOfMessages={0}
onPress={() => {
// do nothing
}}
mb={8}
/>
<AccordionItem
key="random"
icon={<Play hasBackground />}
title={'# random'}
channelStatus="muted"
numberOfMessages={0}
onPress={() => {
// do nothing
}}
mb={8}
/>
</>
),
},
}
export default meta

View File

@ -0,0 +1,23 @@
import { Composer } from './composer'
import type { Meta, StoryObj } from '@storybook/react'
const meta: Meta<typeof Composer> = {
component: Composer,
argTypes: {},
args: {},
parameters: {
design: {
type: 'figma',
url: 'https://www.figma.com/file/qSIh8wh9EVdY8S2sZce15n/Composer-for-Web?node-id=7131%3A360528&t=11hKj5jyWVroXgdu-4',
},
},
}
type Story = StoryObj<typeof Composer>
export const Default: Story = {
args: {},
}
export default meta

View File

@ -0,0 +1,54 @@
import { MINIMAL_VIEWPORTS } from '@storybook/addon-viewport'
import { Topbar } from './topbar'
import type { Meta, StoryObj } from '@storybook/react'
// More on how to set up stories at: https://storybook.js.org/docs/7.0/react/writing-stories/introduction
const meta: Meta<typeof Topbar> = {
title: 'Navigation/Topbar',
component: Topbar,
argTypes: {},
parameters: {
viewport: {
viewports: MINIMAL_VIEWPORTS,
},
design: {
type: 'figma',
url: 'https://www.figma.com/file/qSIh8wh9EVdY8S2sZce15n/Composer-for-Web?node-id=7213%3A553827&t=11hKj5jyWVroXgdu-4',
},
},
}
type Story = StoryObj<typeof Topbar>
// More on writing stories with args: https://storybook.js.org/docs/7.0/react/writing-stories/args
export const Default: Story = {
args: {
title: '# channel',
description: 'This is a channel description',
},
}
export const WithMembersSelected: Story = {
args: {
...Default.args,
membersVisisble: true,
},
}
export const WithGoBack: Story = {
parameters: {
viewport: {
defaultViewport: 'mobile2',
},
},
args: {
...Default.args,
goBack: () => {
// do nothing
},
},
}
export default meta