You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
125 lines
3.5 KiB
125 lines
3.5 KiB
import React from 'react'
|
|
import { storiesOf } from '@storybook/react'
|
|
import { Box, Flex } from 'rebass'
|
|
|
|
import BigArrowLeft from 'components/Icon/BigArrowLeft'
|
|
import BigArrowRight from 'components/Icon/BigArrowRight'
|
|
import Bitcoin from 'components/Icon/Bitcoin'
|
|
import Btcpay from 'components/Icon/Btcpay'
|
|
import ChainLink from 'components/Icon/ChainLink'
|
|
import Channels from 'components/Icon/Channels'
|
|
import Check from 'components/Icon/Check'
|
|
import CheckAnimated from 'components/Icon/CheckAnimated'
|
|
import CheckCircle from 'components/Icon/CheckCircle'
|
|
import Clock from 'components/Icon/Clock'
|
|
import Cloudbolt from 'components/Icon/Cloudbolt'
|
|
import CloudLightning from 'components/Icon/CloudLightning'
|
|
import Contacts from 'components/Icon/Contacts'
|
|
import Copy from 'components/Icon/Copy'
|
|
import Error from 'components/Icon/Error'
|
|
import Eye from 'components/Icon/Eye'
|
|
import Globe from 'components/Icon/Globe'
|
|
import Hand from 'components/Icon/Hand'
|
|
import Help from 'components/Icon/Help'
|
|
import Help2 from 'components/Icon/Help2'
|
|
import IconPlus from 'components/Icon/IconPlus'
|
|
import Lightning from 'components/Icon/Lightning'
|
|
import Litecoin from 'components/Icon/Litecoin'
|
|
import LndLogo from 'components/Icon/LndLogo'
|
|
import LtcLogo from 'components/Icon/LtcLogo'
|
|
import Network from 'components/Icon/Network'
|
|
import Onchain from 'components/Icon/Onchain'
|
|
import PaperPlane from 'components/Icon/PaperPlane'
|
|
import Peers from 'components/Icon/Peers'
|
|
import Plus from 'components/Icon/Plus'
|
|
import PlusCircle from 'components/Icon/PlusCircle'
|
|
import Qrcode from 'components/Icon/Qrcode'
|
|
import Search from 'components/Icon/Search'
|
|
import Settings from 'components/Icon/Settings'
|
|
import SkinnyBitcoin from 'components/Icon/SkinnyBitcoin'
|
|
import Spinner from 'components/Icon/Spinner'
|
|
import Success from 'components/Icon/Success'
|
|
import SystemArrowLeft from 'components/Icon/SystemArrowLeft'
|
|
import SystemArrowRight from 'components/Icon/SystemArrowRight'
|
|
import SystemNavNext from 'components/Icon/SystemNavNext'
|
|
import SystemNavPrevious from 'components/Icon/SystemNavPrevious'
|
|
import User from 'components/Icon/User'
|
|
import Wallet from 'components/Icon/Wallet'
|
|
import Wallet2 from 'components/Icon/Wallet2'
|
|
import Warning from 'components/Icon/Warning'
|
|
import X from 'components/Icon/X'
|
|
import Zap from 'components/Icon/Zap'
|
|
import ZapLogo from 'components/Icon/ZapLogo'
|
|
import ZapLogoBlack from 'components/Icon/ZapLogoBlack'
|
|
|
|
const iconSizes = [16, 32, 64, 128]
|
|
|
|
const zapIconsList = {
|
|
BigArrowLeft,
|
|
BigArrowRight,
|
|
Bitcoin,
|
|
Btcpay,
|
|
ChainLink,
|
|
Channels,
|
|
Check,
|
|
CheckAnimated,
|
|
CheckCircle,
|
|
Clock,
|
|
Cloudbolt,
|
|
CloudLightning,
|
|
Contacts,
|
|
Copy,
|
|
Error,
|
|
Eye,
|
|
Globe,
|
|
Hand,
|
|
Help,
|
|
Help2,
|
|
IconPlus,
|
|
Lightning,
|
|
Litecoin,
|
|
LndLogo,
|
|
LtcLogo,
|
|
Network,
|
|
Onchain,
|
|
PaperPlane,
|
|
Peers,
|
|
Plus,
|
|
PlusCircle,
|
|
Qrcode,
|
|
Search,
|
|
Settings,
|
|
SkinnyBitcoin,
|
|
Spinner,
|
|
Success,
|
|
SystemArrowLeft,
|
|
SystemArrowRight,
|
|
SystemNavNext,
|
|
SystemNavPrevious,
|
|
User,
|
|
Wallet,
|
|
Wallet2,
|
|
Warning,
|
|
X,
|
|
Zap,
|
|
ZapLogo,
|
|
ZapLogoBlack
|
|
}
|
|
|
|
const zapIconStories = storiesOf('Icons', module)
|
|
|
|
Object.keys(zapIconsList).forEach(name => {
|
|
var Icon = zapIconsList[name]
|
|
zapIconStories.add(name, () => (
|
|
<React.Fragment>
|
|
{iconSizes.map(size => (
|
|
<Flex key={`${name}-${size}`} alignItems="center" mb={3}>
|
|
<Box mr={2}>
|
|
{size} x {size}:
|
|
</Box>
|
|
<Icon width={size} height={size} />
|
|
</Flex>
|
|
))}
|
|
</React.Fragment>
|
|
))
|
|
})
|
|
|