Skip to content

Instantly share code, notes, and snippets.

@gustavoguichard
Last active May 10, 2016 19:37
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save gustavoguichard/d18a8d958b198458240d31df48493331 to your computer and use it in GitHub Desktop.
BS SmartGrid
import React, { cloneElement, PropTypes } from 'react'
import { map, chunk, uniqueId } from 'lodash'
export const SmartGrid = ({ columns = 3, minWidth = 'sm', children }) => {
const cols = parseInt(12 / columns, 10)
const join = (...classes) => classes.join(' ')
return (
<div>
{map(chunk(children, columns), (kids, index) =>
<div className="row" key={index}>
{map(kids, child =>
cloneElement(child, {
className: join(`col-${minWidth}-${cols}`, child.props.className),
key: uniqueId('column'),
})
)}
</div>
)}
</div>
)
}
SmartGrid.propTypes = {
columns: PropTypes.number,
minWidth: PropTypes.string,
children: PropTypes.array.isRequired,
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment