react-grid-layout: [Bug] Unexpected warning: `Failed prop type: minWidth larger than item width/maxWidth`

This is my child component

<MyWidget ... layout={{ x: 0, y: 0, w: 5, h: 5, minW: 3 }}>

I am getting this warning just because I put minW: 3

Warning: Failed prop type: minWidth larger than item width/maxWidth in GridItem (created by ReactGridLayout) in ReactGridLayout (created by ResponsiveReactGridLayout) in ResponsiveReactGridLayout (created by Measure) in Measure (created by ResponsiveReactGridLayout) in ResponsiveReactGridLayout (created by Dashboard)

When I investigated I discovered that it arrives to GridItems.js with w=2 (even if I explicitly set it to 3).

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 6
  • Comments: 16

Most upvoted comments

I am encountering the same issue. I believe it occurs if your grid item width and/or height is less than 1. In the source in GridItem.jsx, there are defaultProps where minW and minH are set to 1. Can anyone think of a way to override those values?

Same here any updates. I have the same issue

index.js:1375 Warning: Failed prop type: minHeight larger than item height/maxHeight
    in GridItem (created by ReactGridLayout)
    in ReactGridLayout (created by ResponsiveReactGridLayout)
    in ResponsiveReactGridLayout (created by WidthProvider)
    in WidthProvider (at table-large.jsx:24)
    in CSSTransitionGroupChild (created by TransitionGroup)
    in span (created by TransitionGroup)
    in TransitionGroup (created by CSSTransitionGroup)
    in CSSTransitionGroup (at table-large.jsx:15)
    in TableLarge (at table-leadbox.component.jsx:50)
    in div (at table-leadbox.component.jsx:58)
    in TableLeadBox (at lead-box-container.component.jsx:24)
    in div (at lead-box-container.component.jsx:15)
    in div (at lead-box-container.component.jsx:13)
    in div (at lead-box-container.component.jsx:12)
    in LeadBoxContainer (at App.js:18)
    in div (at App.js:11)
    in App (created by ConnectFunction)
    in ConnectFunction (at src/index.js:11)
    in Provider (at src/index.js:10)

public static defaultProps = { className: 'layout', cols: { lg: 12, md: 10, sm: 6, xs: 4, xxs: 3 }, rowHeight: 100 }

xxs set to be larger than minW

+1 - This is happening to me too. Has anyone learned what is happening here?