I would go with vanilla Bootstrap (just the Sass part, not the JS part).
Bootstrap CSS utilities are very nice: same principles as Tailwind CSS.
- The most popular
- Well maintained: https://github.com/twbs/bootstrap/pull/23586
- Well documented
- Well tested: https://github.com/twbs/bootstrap/tree/master/js/tests
- Very well coded and thought: https://github.com/twbs/bootstrap/blob/4bcac68ec9abea721fa1d9d873b43dffe8d1e2e3/scss/_buttons.scss
- Comes with CSS utilities like Tailwind CSS: https://getbootstrap.com/docs/4.4/utilities/
- Not bloated: https://getbootstrap.com/docs/4.4/getting-started/theming/#importing
Small example app: https://github.com/tkrotoff/MarvelHeroes (React with hooks, Bootstrap 4, TypeScript, React Router, Jest)
You will read only good things about it on Reddit, Twitter... people love it. See it as lower level compared to Bootstrap, it does not come with a UI: you have to code it yourself (you could re-create Bootstrap using it). Fits perfectly if you need to code your own design system. People are rediscovering the simplicity of CSS classes.
Use React Bootstrap/Reactstrap only when needed (collapse for example): one layer less to learn and maintain.
Does not bring that much value (
<button className="btn btn-primary"> vs
<Button variant="primary">) + you will be able to update Bootstrap without waiting for React Bootstrap/Reactstrap to catch up.
Very popular right now (and well done, well maintained, well tested and documented, full of features...) but kind of bloated: JSS, generates a big and ugly DOM, more concepts to grasp...
Too minimalist, quite verbose (is-three-quarters, is-three-fifths, is-primary, has-icons-left...), with very limited utility classes.
Less popular than Material-UI, too new and does not come with unit tests: https://github.com/chakra-ui/chakra-ui/tree/v0/packages/chakra-ui/tests. I would never invest time using a UI library that is not properly tested.
Less popular than Material-ui, huge bundle:
- https://email@example.com/dist/ vs https://unpkg.com/browse/@firstname.lastname@example.org/umd/
- https://email@example.com vs https://bundlephobia.com/result?p=@firstname.lastname@example.org
And they did that: https://blog.shunliang.io/frontend/2018/12/25/the-ant-design-xmas-egg-that-went-wrong.html (!!!)