react-grid-system | A powerful Bootstrap-like responsive grid system for React | Grid library

Any idea how to resolve this error? I get it when trying npm install:

npm ERR! Found: react@16.14.0 npm ERR! node_modules/react npm ERR! react@"^16.14.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@"^17.0.1" from react-card-flip@1.1.0 npm ERR! node_modules/react-card-flip npm ERR! react-card-flip@"^1.0.11" from the root project

The package.json has: "react-card-flip": "^1.0.11",

I removed the node_modules directory and the package-lock.json file.

I'm not sure where the reference to 1.1.0 is coming from. I DID try to install it earlier when trying to upgrade React 17, but ran into limitations with blueprintjs/core 3.39.0 requiring React 16.14.0.

Thanks for any ideas or help you can provide.

Full content of the package.json below in case that helps.

package.json content:

I am using react-grid-system with an image and two columns for text as follows:

hello i am looping multiple check boxes on left side , based on checked check boxes , pushing the checked status and value of that check box in right side and showing as a check box , if i unchecked the right side check box it disappear applied by me but after disappearing the right side check boxes then on the left side check box should be update as uncheck... but dom is not updating as unchecked ....can any one help on these this is the link of code sand box : https://codesandbox.io/s/material-demo-eoiiv?file=/demo.js

I manage to use react-intersection-observer in a Function Component. However, I have not been successful when using it with a Class Component. I tried to follow the documentation but I am getting the following error:

Invariant failed: react-intersection-observer: No DOM node found. Make sure you forward "ref" to the root DOM element you want to observe.

What am I doing wrong? Thank you in advance.

Pseudo-code

• Trigger animation when the element is visible in the viewport.

CodesandBox

itemsCarousel for not scrolling to first item..if tried to see third item, I can see that again first item will appear in the list, that i cant see the third item is active or not....as i am trying to use itemsCarousel for list of menu that i have more than 10 options. please go through below link of codesandbox code is availble there https://codesandbox.io/s/still-pine-kl9jb?file=/src/main-menu.js:0-939

app.js

Creating a components library, I wanted to include the layout components directly in the library. For that I just created the classics component (Container, Row and Col) which is actually just a copy of the ones from the library react-grid-system.

So for example, my component Col look like that: