add icons story
This commit is contained in:
parent
b071431c1b
commit
5b6829147e
|
@ -0,0 +1,48 @@
|
||||||
|
import * as icons from '@status-im/icons'
|
||||||
|
|
||||||
|
import { Text } from '../typography'
|
||||||
|
|
||||||
|
import type { IconProps } from '@status-im/icons'
|
||||||
|
import type { Meta, StoryObj } from '@storybook/react'
|
||||||
|
import type React from 'react'
|
||||||
|
|
||||||
|
// More on how to set up stories at: https://storybook.js.org/docs/7.0/react/writing-stories/introduction
|
||||||
|
const meta: Meta = {
|
||||||
|
title: 'icons',
|
||||||
|
// component: Button,
|
||||||
|
argTypes: {},
|
||||||
|
}
|
||||||
|
|
||||||
|
type Story = StoryObj
|
||||||
|
|
||||||
|
function unpascal(str: string) {
|
||||||
|
return str.replace(/([A-Z])/g, ' $1').trim()
|
||||||
|
}
|
||||||
|
|
||||||
|
// More on writing stories with args: https://storybook.js.org/docs/7.0/react/writing-stories/args
|
||||||
|
export const All: Story = {
|
||||||
|
args: {},
|
||||||
|
render: () => {
|
||||||
|
return (
|
||||||
|
<div style={{ display: 'grid', gap: 12 }}>
|
||||||
|
{Object.keys(icons).map(name => {
|
||||||
|
// @ts-ignore
|
||||||
|
// eslint-disable-next-line import/namespace
|
||||||
|
const Icon = icons[name] as React.FunctionComponent<IconProps>
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
key={name}
|
||||||
|
style={{ display: 'flex', flexDirection: 'column' }}
|
||||||
|
>
|
||||||
|
<Icon color="black" />
|
||||||
|
<Text>{unpascal(name)}</Text>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
export default meta
|
Loading…
Reference in New Issue