on bc37544 help sign in
37 lines 945 B history raw
1import React from 'react';
2import cn from 'classnames';
3import { Grid, Flex } from 'indigo-react';
5export default function Tabs({
6 views,
7 options,
8 currentTab,
9 onTabChange,
10 className,
11 ...rest
12}) {
13 const Tab = views[currentTab];
15 return (
16 <Grid className={className}>
17 <Grid.Item full as={Flex} wrap className="b-gray3 bb1">
18 {options.map(option => {
19 const isActive = option.value === currentTab;
20 return (
21 <Flex.Item
22 key={option.value}
23 onClick={() => onTabChange(option.value)}
24 className={cn('f5 pv3 mr6 clickable', {
25 'black b-black bb1': isActive,
26 gray3: !isActive,
27 })}
28 style={{ marginBottom: '-1px' }}>
29 {option.text}
30 </Flex.Item>
31 );
32 })}
33 </Grid.Item>
34 <Grid.Item full as={Tab} className="mt6" {...rest} />
35 </Grid>
36 );