react-legos
Version:
A React component to render LEGO bricks
37 lines (23 loc) • 1.45 kB
Markdown
# react-legos
[](https://badge.fury.io/js/react-legos)
<img width="1041" alt="screen shot 2017-12-19 at 11 57 11 pm" src="https://user-images.githubusercontent.com/3171252/34193282-82468e80-e518-11e7-8b0c-c30ff0d6112e.png">
Try it out in [Storybook](https://bryce.io/react-legos).
## Make a LEGO brick!
```jsx
import Brick, { shapes } from 'react-legos'
...
<Brick shape={shapes['twoByFour']} />
```
## Props
Prop | Default | Description
---- | ------- | -----------
`shape` || The shape of the brick. A grid of true/false values to determine if the index is a space or filled.
`size` | `medium` | The size of the brick: small, medium, or large.
`style` || Optional style param, useful for z-indexing and placing bricks on top of one another.
`color` | `#eee` | The color of the brick, Can use colors in `lib/colors.js`, which correspond to [this list](http://www.peeron.com/cgi-bin/invcgis/colorguide.cgi).
`opacity` | 1 | For making the brick transparent.
`optimize` | `true` | Disable to render all sides of bricks, including invisible ones.
## Issues
If you find any issues with this component, please [report](https://github.com/brycedorn/react-legos/issues) them!
## Note
LEGO and the LEGO logo are trademarks and/or copyrights of the LEGO Group. This is not at all affiliated with The LEGO Group, and was simply a project of mine using the LEGO name as a proprietary eponym.