npm

Need private packages and team management tools?Check out npm Orgs. »

library-grid-component

1.0.24 • Public • Published

Grid Component

Grid component for React

Install and save component as a dependency


npm install --save library-grid-component

Import component into your app


import Grid from 'library-grid-component'

Create an array of objects with the key being data


const gridData = [
    { data: 'Item' },
    { data: 'Item' },
    { data: 'Item' }
]

Render the component with the object array we created as well as any other props that are needed


render () {
    const gridData = [
        { data: 'Item' },
        { data: 'Item' },
        { data: 'Item' }
    ]

    return (
        <GridComponent
            gridData={gridData}
            gridItemMinWidth="100"
            gridItemLayout="1x1"
            gridItemColour="#262626"
            gridItemFill="#ffffff"
            gridItemShadow={true}
            gridItemBorder={false}
            gridItemBorderRadius="5"
            gridItemAlignment="center" />
    )
}

Prop Values
gridData Object
gridItemMinWidth Min width for each item
gridItemLayout 1x1, 2x1, 3x1, 4x1
gridItemColour HEX colour code
gridItemFill HEX colour code
gridItemShadow true or false
gridItemBorder true or false
gridItemBorderColour HEX colour code
gridItemBorderRadius Pixels
gridItemAlignment left, right, center

Keywords

none

install

npm i library-grid-component

Downloadsweekly downloads

27

version

1.0.24

license

MIT

last publish

collaborators

  • avatar
Report a vulnerability