const Dashboard = ({ children }) => ( <Row type="flex" justify="space-around" align="top" gutter={24}> {children} </Row> )
sample.map((item, i) => ( <Button key={i} className={colorState == i ? 'mapbox__sample__button mapbox__sample__button--active' : 'mapbox__sample__button'} onClick={() => { setColorState(i) }}> <span style={{ background: `linear-gradient(90deg, ${item[3]['color']} 0%, ${item[2]['color']} 50%,${item[1]['color']} 100%)` }}></span> </Button> ))
const Dashboard = ({ children }) => ( <Row type="flex" justify="space-around" align="top" gutter={24}> {children} </Row> )
const Dashboard = ({ children }) => ( <Row type="flex" justify="space-around" align="top" gutter={24}> {children} </Row> )
const Dashboard = ({ children }) => ( <Row type="flex" justify="space-around" align="top" gutter={24}> {children} </Row> )
const Dashboard = ({ children }) => ( <Row type="flex" justify="space-around" align="top" gutter={24}> {children} </Row> )