git.iko.soy/bridge
on f34e8d0 help sign in
bridge/src/indigo-react/components/IconButton.js
48 lines 1.0 kB history raw
1import React from 'react';
2import cn from 'classnames';
4import Flex from './Flex';
6export default function IconButton({
7 children,
8 className,
9 onClick,
10 disabled = false,
11 solid = false,
12 ...rest
13}) {
14 return (
15 <Flex
16 as="a"
17 align="center"
18 justify="center"
19 className={cn(
20 'pointer p2',
21 {
22 'bg-black': solid && !disabled,
23 'bg-gray3': !solid || disabled,
24 },
25 {
26 white: solid,
27 black: !solid && !disabled,
28 gray4: !solid && disabled,
29 },
30 className
31 )}
32 style={{
33 width: '1rem',
34 height: '1rem',
35 fontSize: '1rem',
36 fontWeight: 'bold',
37 // TODO: ^ replace with 1:1 svgs and remove explicit sizing
38 ...(disabled && {
39 pointerEvents: 'none',
40 cursor: 'not-allowed',
41 }),
42 }}
43 onClick={onClick ? () => !disabled && onClick() : undefined}
44 {...rest}>
45 {children}
46 </Flex>
47 );