38 lines
874 B
JavaScript
38 lines
874 B
JavaScript
|
import { Panel } from '../Panel'
|
||
|
|
import * as icons from '.'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
title: 'SkynetLibrary/Icons',
|
||
|
|
decorators: [
|
||
|
|
(Story) => (
|
||
|
|
<div style={{ margin: 50 }}>
|
||
|
|
<Story />
|
||
|
|
</div>
|
||
|
|
),
|
||
|
|
],
|
||
|
|
}
|
||
|
|
|
||
|
|
export const DefaultSizeIcon = () => <icons.SkynetLogoIcon />
|
||
|
|
|
||
|
|
export const LargeIcon = () => <icons.SkynetLogoIcon size={60} />
|
||
|
|
|
||
|
|
export const AllIcons = () => {
|
||
|
|
const sizes = [24, 32, 60]
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
{Object.entries(icons).map(([iconName, IconComponent]) => (
|
||
|
|
<Panel key={`panel-${iconName}`}>
|
||
|
|
<pre>{iconName}</pre>
|
||
|
|
|
||
|
|
<div style={{ padding: 10, border: '1px dashed #fafafa', display: 'flex', alignItems: 'center', gap: 50 }}>
|
||
|
|
{sizes.map((size) => (
|
||
|
|
<IconComponent key={`${iconName}-${size}`} size={size} />
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</Panel>
|
||
|
|
))}
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|