Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

react-bootstrap

react-bootstrap3.7mMIT2.10.9TypeScript support: included

Bootstrap 5 components built with React

bootstrap, react, component, components, ecosystem-react, react-component

readme

React-Bootstrap

Bootstrap 5 components built with React.

GitHub Actions CI status Travis CI Build status npm Codecov Discord Netlify

Bootstrap compatibility

React-Bootstrap is compatible with various versions of Bootstrap. As such, you need to ensure you are using the correct combination of versions.

See the below table on which version of React-Bootstrap you should be using in your project.

Bootstrap Version React-Bootstrap Version Documentation
v5.x 2.x Link
v4.x 1.x (not maintained) Link
v3.x 0.33.x (not maintained) Link

Migrating from previous versions

Bootstrap 4 to Bootstrap 5

If you would like to update React-Bootstrap within an existing project to use Bootstrap 5, please read our docs for migrating to React-Bootstrap V2.

Bootstrap 3 to Bootstrap 4

If you would like to update React-Bootstrap within an existing project to use Bootstrap 4, please read our docs for migrating to React-Bootstrap V1.

Local setup

Yarn is our package manager of choice here. Check out setup instructions here if you don't have it installed already. After that you can run yarn run bootstrap to install all the needed dependencies.

From there you can:

  • Run the tests once with yarn test (Or run them in watch mode with yarn run tdd).
  • Start a local copy of the docs site with yarn start
  • Or build a local copy of the library with yarn run build

CodeSandbox Examples

Click here to explore some React-Bootstrap CodeSandbox examples.

Click here to automatically open CodeSandbox with the React-Bootstrap CodeSandbox Examples GitHub Repository as a workspace.

Contributions

Yes please! See the contributing guidelines for details.

changelog

2.10.9 (2025-01-30)

Bug Fixes

2.10.8 (2025-01-21)

Bug Fixes

2.10.7 (2024-12-15)

Bug Fixes

2.10.6 (2024-11-25)

Bug Fixes

2.10.5 (2024-09-26)

Bug Fixes

  • Fade: fix ref warning for react 18.3+ (#6820) (9b8bcd7)
  • Offcanvas: do not trigger Navbar onToggle when closing (#6829) (6836e99)

2.10.4 (2024-06-30)

Bug Fixes

2.10.3 (2024-06-19)

Bug Fixes

2.10.2 (2024-03-18)

Bug Fixes

2.10.1 (2024-02-10)

Bug Fixes

2.10.0 (2024-01-17)

Bug Fixes

  • Modal: properly handle data-bs-theme attribute (#6743) (1ead9ca)

Features

2.9.2 (2023-12-22)

Bug Fixes

  • AccordionBody: add AccordionBody to index exports (#6732) (d34244b)
  • Dropdown: prevent flickering on 'mousedown' rootCloseEvent (#6714) (a58a0cd)
  • Navbar: add missing type for sticky bottom (#6726) (36d0b7a)

2.9.1 (2023-10-21)

Bug Fixes

2.9.0 (2023-09-27)

Features

2.9.0-beta.1 (2023-08-07)

Bug Fixes

  • fix RSC error with createWithBsPrefix components (#6672) (49b3270)
  • DropdownItem: simplify component type (#6659) (d25e5f9)
  • FormControl: add size support when using plaintext (#6667) (57b4e29)
  • OverlayTrigger: position overlay properly when defaultShow set (#6657) (6bb3842)
  • ToggleButton: fix id to be required in props (#6658) (1b410eb)

2.9.0-beta.0 (2023-07-05)

Features

2.8.0 (2023-06-23)

Bug Fixes

Features

  • PageItem: add linkStyle and linkClassName props (#6636) (cc8efc3)
  • add underline variant for Nav/Tabs (#6623) (600364b)

2.7.4 (2023-04-15)

Bug Fixes

2.7.3 (2023-04-12)

Bug Fixes

  • ToastContainer: allow setting containerPosition without position (#6574) (41ec134)
  • switch from defaultProps to JS default params (#6568) (1d5b726)

2.7.2 (2023-02-14)

Bug Fixes

2.7.1 (2023-02-10)

Bug Fixes

  • Accordion: fix aria-expanded value when using alwaysOpen (#6537) (7f633bf), closes #6536 #6536
  • Overlay: fix flickering of tooltips and popovers during initial render (#6544) (821624d)
  • Stack: fix incorrect classes being generated (#6540) (e3a77e1)

2.7.0 (2022-12-07)

Bug Fixes

  • Dropdown: fic missing .show class on dropdown toggle when active (#6508) (eaa4bb9)
  • Modal: fix modal not closing when keyboard=false (#6515) (92703d5)

Features

  • AccordionBody: add transition callback props (#6478) (ba092df)
  • Dropdown: add support for centered dropdown menus (#6490) (500ee94)
  • Ratio: add support for portrait size ratios (#6501) (3cfdab1)

2.6.0 (2022-11-06)

Bug Fixes

Features

  • Spinner: make the animation default to border (#6468) (fb3e4d5)

2.5.0 (2022-08-05)

Bug Fixes

  • Offcanvas: prevent children mounting twice on show when not responsive (#6416) (e2c4eeb)
  • ensure consistent API for custom variants (#6398) (8a81903)
  • update @restart/ui to 1.3.1 (#6408) (a49d435)

2.5.0-beta.1 (2022-07-08)

Bug Fixes

  • Dropdown: remove unused flip prop (7c2002f)
  • update @restart/ui to v1.3.0 (#6383) (775e774)
  • Offcanvas: fix responsive behavior when resizing screen (#6380) (a3e188a)

Features

  • DropdownButton: add flip prop support (85ef5bc)
  • SplitButton: add flip prop support (909c564)
  • Tabs: allow fill and justify settings for tabs (#6391) (239c459)

2.5.0-beta.0 (2022-06-10)

Bug Fixes

  • NavbarOffcanvas: fix render to be SSR safe (#6360) (94d2fb4)
  • Overlay: fix initial positioning of overlays (#6348) (bdb89d5)
  • ToggleButtonGroup: remove extra onChange check (#6345) (52220e0)

Features

  • FormCheck: add support for reverse checks and radios (#6353) (dd41911)
  • Offcanvas: add responsive support (#6363) (3bc4df2)
  • Offcanvas: added support for static backdrops (#6342) (e5b7c89)
  • Table: add support for striped columns (#6344) (9dc95c7)
  • ThemeProvider: support breakpoints smaller than xs (#6371) (09bf4a2)

2.4.0 (2022-05-13)

Features

  • ToastContainer: add containerPosition prop (#6316) (9815957)

2.3.1 (2022-04-28)

Bug Fixes

  • NavbarOffcanvas: fix rendering of nav items when expand is used (#6310) (63869f9)
  • TabPane: omit Transition when prop is false (#6305) (1c71e9e)

2.3.0 (2022-04-19)

Bug Fixes

Features

  • Pagination: Wrap Pagination sub-components in forward refs (#6306) (2686ae3)

2.2.3 (2022-04-05)

Bug Fixes

2.2.2 (2022-03-25)

Bug Fixes

  • update @restart/ui to v1.2.0 (#6285) (4f5e625)
  • Modal: fix autofocus for inputs when animation is enabled (#6278) (08e1bbc)
  • Modal: render aria-describedby on the top level modal element (#6282) (93a8a0e)
  • Modal: render aria-label on top level modal element (#6269) (48f7c07)

2.2.1 (2022-03-11)

Bug Fixes

  • Carousel: fix issue where changing activeIndex won't work (#6265) (0c7c5f7)
  • useOverlayOffset: use offset prop in useOverlayOffset (#6264) (e338818)

2.2.0 (2022-03-04)

Bug Fixes

  • TabPane: use Fade for default transition (#6235) (3e0b4d3)
  • added missing ModalHeader exports to index (#6228) (3332da9)

Features

2.1.2 (2022-01-31)

Bug Fixes

2.1.1 (2022-01-14)

Bug Fixes

  • prioritize poppers position prop in overlaytrigger (#6175) (dc9a0d7)

2.1.0 (2021-12-31)

Features

2.0.4 (2021-12-20)

Bug Fixes

2.0.3 (2021-12-01)

Bug Fixes

2.0.2 (2021-11-04)

Bug Fixes

  • remove unused files from build output

2.0.1 (2021-10-29)

Bug Fixes

2.0.0 (2021-10-21)

2.0.0-rc.1 (2021-10-15)

Bug Fixes

Features

2.0.0-rc.0 (2021-09-21)

Bug Fixes

  • ListGroupItem: fix .active not being set with activeKey in ListGroup (#6002) (cdaa039)
  • Toast: fix fade animation (#6004) (0237a14)
  • refactor(Col)!: remove default span value in breakpoint object (#6014) (ec285fb), closes #6014
  • refactor(CardColumns)!: remove component (#6030) (d36718f), closes #6030
  • fix(FormCheck)!: use feedbackType to control feedback type (#6015) (ab9e080), closes #6015

Features

BREAKING CHANGES

  • When using objects in Col breakpoint props, span is no longer true by default
  • Removed CardColumns because it was dropped in Bootstrap 5
  • FormCheck feedback type is now controlled by feedbackType instead of isValid and isInvalid.

2.0.0-beta.6 (2021-08-24)

Bug Fixes

  • Dropdown: fix menu positioning when renderOnMount=true (#5989) (a2a4125)
  • Offcanvas: change .modal-backdrop to .offcanvas-backdrop (#5984) (e3f6046)

Features

2.0.0-beta.5 (2021-08-17)

Bug Fixes

Features

  • Dropdown: add RTL support (22d8d84)
  • Modal: add RTL support (0cd40eb)
  • Modal: migrate to restart/ui (1ff7af7)
  • Popover: add RTL support (9032b16)
  • Tabs: migrate to restart/ui (8e3f3c2)
  • Tooltip: add RTL support (c82e133)
  • add default variant to Alert/Badge (#5456) (8f76539)
  • migrate components to restart/ui (73a559e)
  • feat(SafeAnchor)!: migrate to restart/ui (6c56aba)
  • feat(NavLink)!: migrate to restart/ui (87bf01a)
  • feat(Nav)!: migrate to restart/ui (2a7a0e2)
  • feat(Dropdown)!: migrate to restart/ui (7030465)

BREAKING CHANGES

  • SafeAnchor renamed to Anchor
  • remove onSelect in NavItem
  • removed keyboard navigation in Nav
  • remove onSelect from DropdownItem

2.0.0-beta.4 (2021-07-20)

Bug Fixes

2.0.0-beta.3 (2021-07-15)

Bug Fixes

  • use shared modal manager to sync container state (#5917) (46eb1bb)
  • Modal: fix wrong types on ModalProps (#5894) (1db1f11)

2.0.0-beta.2 (2021-06-19)

Bug Fixes

2.0.0-beta.1 (2021-06-18)

Bug Fixes

  • Form: fix controlId override behavior on FormRange and FormSelect (#5880) (866ec5b)
  • NavDropdown: fix align="end" not working (#5878) (a307102)

Features

2.0.0-beta.0 (2021-06-03)

Bug Fixes

Features

2.0.0-alpha.2 (2021-05-17)

Bug Fixes

Features

  • refactor(Dropdown)!: simplify menu alignment API (#5759) (8a7e095), closes #5759

BREAKING CHANGES

  • removes alignRight and menuAlign props in favor of align

2.0.0-alpha.1 (2021-04-13)

Bug Fixes

  • Nav: add .card-header-* only if nested in card header (#5720) (793e857)
  • types: fix types for event key (#5727) (6260997)

Features

2.0.0-alpha.0 (2021-03-13)

Bug Fixes

Features

1.5.2 (2021-03-11)

Bug Fixes

1.5.1 (2021-03-02)

1.5.0 (2021-02-16)

Bug Fixes

  • Carousel: Fix ref type (#5613) (4e28124)
  • fix TS error with transition types (#5610) (bb84d81)
  • Navbar: remove invalid sticky bottom reference (#5656) (53ce159)
  • Prevent transitionend events from cutting off animations (#5649) (459b4e3)
  • Overlay: show tooltips for func overlay without transition (#5631) (278eff7)

Features

1.4.1 (2021-01-07)

Bug Fixes

  • Carousel: fix pause not working properly with touch devices (#5435) (5a5d636)
  • fix types for DropdownButton and SplitButton (#5589) (df6024b)
  • Prevent focus on disabled nav items or list group items only (#5593) (198931d)
  • Alert: Properly spread props when transition={false} (#5545) (1352a87)
  • DropdownMenu: Fix base styles being overridden by popper styles (#5466) (aec9151)
  • Modal: Remove role="document" from ModalDialog (#5529) (af3453a)
  • types: inherit FormCheckTypes from React.InputHTMLAttributes (#5497) (4b257b6)
  • types: Set @types/react to >=16.9.35 (#5542) (d337c95)

1.4.0 (2020-10-21)

Bug Fixes

  • Button: display variant only when set (#5458) (f963ab3), closes #5456
  • docs: Move ast-types to resolutions (#5467) (5a5c3eb)
  • docs: roll-back resolution versions (5d8f394)
  • Allow falsy eventKeys in DropdownItem and ListGroupItem (#5404) (f493a15)
  • popover arrow misaligned when class is prefixed (#5416) (a0f404a)
  • Accordion: Use empty SelectableContext to prevent dropdown from closing accordion (#5201) (62a9d8b)
  • carousel: prevent intervals from being 0 (1d4294b)
  • carousel: re-implement with committed ref (c8edc2c)
  • docs: type mismatch with environment variable (647b4ff)
  • Fade: fix TS props to work with TransitionType (#5398) (79447a7)
  • FormLabel: Add missing class for col label sizing (#5382) (52e92fc)
  • OverlayTrigger: Add func as valid prop type for children (#5393) (6d12869)
  • Fix clearing nextDirectionRef in <Carousel> (#5322) (5c5ea8d), closes #5319

Features

  • carousel: add individual item intervals (d4e12f0), closes #5305
  • carousel-item: add prop type-checking for the interval prop (c1c72e0)
  • DropdownMenu: Add responsive menu alignment (#5307) (b5ec39e)
  • FormCheck: Allow custom controls to render without a label (#5427) (1ac7f50)
  • netlify: inject netlify build environments into static site (235946d)
  • netlify: more resilient netlify docs alert implementation (02a71b1)
  • ToggleButtonGroup: Add vertical option (#5371) (c049dac)

1.3.0 (2020-07-23)

Bug Fixes

  • Alert: Fix transition prop to allow bools (f4e7630)

Features

  • allow renderProp pattern in OverlayTrigger (#5316) (b2bf177)
  • Dropdown: Add Dropdown.ItemText component (#5315) (3960106)

1.2.2 (2020-07-12)

Bug Fixes

1.2.1 (2020-07-10)

Bug Fixes

  • Popover: arrow offset when scrolling offscreen (#5287) (0e86a51)

1.2.0 (2020-07-10)

Bug Fixes

  • Tooltip: *-start and *-end placements work correctly (1c99fec)
  • types: allow anything in linkProps (4bd37b7), closes #5249
  • bump RTG types to latest (750d63f)
  • helper typing and missing host props (d5f39e7)
  • Form: Fix types (#5274) (596cee7)
  • Overlay: Fix types and overlay example (#5275) (f14ca04)

Features

  • OverlayTrigger: expose show for manually controlling visibility (77f105a)
  • OverlayTrigger: expose show for manually controlling visibility (#5282) (d7dab82)

1.1.1 (2020-07-07)

Bug Fixes

  • types: include dep type defs in dependencies" (8e30fb8), closes #5271
  • types: type exports not being removed from compiled out (7b4c639), closes #5267

1.1.0 (2020-07-06)

Bug Fixes

  • Button: Use type attribute if specified (#5208) (426b6da)
  • Toast: Fix bsPrefix (#5240) (501b3bf)
  • Toast: Reset autohide timer only if show or autohide changed (#5220) (20b532d)
  • make each context unique to prevent them being optimized away by Parcel (#5181) (c918dbf)

Features

1.0.1 (2020-04-22)

Bug Fixes

1.0.0 (2020-03-23)

Features

  • feat!: bump react-overlays (#5017) (1b20f1b), closes #5017

Bug Fixes

BREAKING CHANGES

  • only breaking if you pass a popperConfig directly to overlay or dropdown components. The config format is now the v2 one. This change only relevant to users of popperConfig prop on Overlay, OverlayTrigger, and Dropdown

  • docs: update some packages, clean up version dropdown a bit

  • Apply suggestions from code review

  • fail in the right place

  • clean up popper injected props

  • fix types

Co-authored-by: Jimmy Jia tesrin@gmail.com

1.0.0-beta.17 (2020-02-28)

Bug Fixes

  • Alert: forward ref to the alert dom element (#5010) (fb79f2a)
  • Container: fluid breakpoint typings (#5011) (f4dde13)
  • add displayName to Row (#4919) (a1e54a2)
  • don't construct ModalManager while document.body may still be null (#4982) (5aa2be1)
  • fix small typo in description of eventKey (4ec9d79)
  • tooltip: prevent non-boolean attribute warning when passing show to Tooltip (#4858) (2505cb7)
  • types: fix type of Overlay's onHide prop (#4857) (d616175)

Features

1.0.0-beta.16 (2019-11-20)

Bug Fixes

1.0.0-beta.15 (2019-11-18)

Bug Fixes

  • FormControl: onChange and innerRef ts decls (#3583,#3568,#2781) (#4435) (74a36bc)
  • added eslint pragma for ignoring dangerouslySetInnerHTML (ce7a4bd)
  • cleanup (210799d)
  • duplicate class "carousel-item" (#4609) (34e3905)
  • ordering of propTypes (e7efa8f)
  • removed sponsorship section (cee3efa)
  • updated Overlay Trigger to support flip property (#4660) (ed77ae7)
  • Pagination: support for ref attribute (#4593) (e5caa0f)
  • Popover: support for ref attribute (0ad84a8)
  • ResponsiveEmbed: support for ref attribute (4da7ef6)
  • TabContent: support for ref attribute (334ff8d)
  • Table: allow passed in refs to be properly forwarded (#4592) (0e10671)
  • toggle-button-group: migrate to be ref forwarder (ba45a53), closes #4194
  • tests (d21f42a)
  • use normal function instead arrow (e3a28cb)

chore

Features

BREAKING CHANGES

  • custom Dropdown Menu's and Toggles can no longer be class components unless they are wrapped in forwardRef()

1.0.0-beta.14 (2019-10-04)

Bug Fixes

1.0.0-beta.13 (2019-10-03)

Bug Fixes

  • types: add missing Popover and Modal props. (#4464) (b0ad147)
  • linting issue (9b5a8be)
  • navbar toggle correct 'collapsed' className when collapsed (#4412) (bcb0c8e)
  • TabContainer: Resolve lifecycle deprecation (#4370) (8103448)
  • navs have the wrong role, as well as tabs navigation visual glitch (#4372) (5e1668a), closes #4371
  • AbstractNav: Re-add role attribute to abstract nav (#4331) (6c2dd84)
  • form: remove unused default props definition (fix: #4335) (#4349) (b813842)
  • progress-bar: cleanup implementation to be closer to previous (355fe42)

Features

  • hooks: migrate useAccordionToggle to be named export (a978ebb)
  • refs: migrate more components to properly forward their refs (7d5eef1), closes #4194
  • add Switches (#4268) (98297c6)
  • Add the as prop to Badge to support actionable badges (#4295) (db09dc0), closes #4227
  • types: add useAccordionToggle types (714066d), closes #4191

BREAKING CHANGES

  • hooks: useAccordionToggle is now being exported from AccordionToggle rather than useAccordionToggle. It also needs to be imported as a named import, rather than an unnamed import.

1.0.0-beta.12 (2019-08-16)

Bug Fixes

  • Export declared classes (0822533)
  • navbar: context linking issues due to incorrect name (ab49a83)
  • navbar: resolve lifecycle warning issue (7dacfaf), closes #4240
  • types: Toast component (#4246) (c30e131)

Performance Improvements

  • navbar: memoize callback function (dd0003d)
  • navbar: memoize context provider value (41f32e1)

1.0.0-beta.11 (2019-08-09)

Bug Fixes

  • AbstractNav: allow passed in refs to be properly forwarded (#4031) (bda567f)
  • Fix DropdownToggleProps (686629d)
  • Modal: directly show backdrop if no animation (fix: #4190) (#4192) (0d02bf6)
  • Apply suggestions from code review (c3fab88)
  • Button: not pass type prop to custom comp (fix: #3340) (#4173) (5725f65)
  • Carousel: fixes #4136 - reverse carousel slide navigation direction for touch (#4137) (5be68b7)
  • Input and List Group components not properly forwarding refs (8c0cf4a), closes #4012 #4031
  • Remove assertions that test implementation details (44d5e28)

Features

  • Add simple Popover type test (#4103) (7715513), closes #4093
  • Migrate Fade and Jumbotron to be ref forwarders (9240fe0)
  • Migrate SafeAnchor to be a ref forwarder (fc41617)
  • Migrate Spinner and SplitButton to be ref forwarders (8cb7306)
  • Migrate Tabs to be a ref forwarder (f16d29b)
  • Migrate Toast and ToastHeader to be ref forwarders (7fa9489)
  • Migrate Tooltip to be a ref forwarder (df29001)

1.0.0-beta.10 (2019-07-15)

Bug Fixes

  • FormText: 'muted' prop bug in <FormText />. (#3901) (0bb8a6f)
  • even more explicit arguments for callback function (e4e85a3)
  • TabPane: wrong assigned Transition event(unmountOnExit) (b3c44c2)
  • types: Alert and Badge ref typing (d11cfed)
  • types: type clean up for eventKey and removal of some unneeded type helpers (6742c05)
  • build step due execa version bump (fix #3964) (63d9a8b)
  • enzyme not properly firing event handlers during testing (085f862)
  • explicit arguments for function callback of ToggleButtonGroup (c037abc)
  • more explicit argument syntax for ToggleButtonGroup callback (20eb49d)
  • Popover placement prop-types to correct list of props (7c0c490)
  • revert ignore linting error issue and add bindings for global (22895f0)
  • separate state variables for Controlled example of Carousel (f53405f)
  • Use useRef rather than useState for DOM references (1877431)

Features

  • Add a swipe threshold as per the upstream implementation (3fc2ce5)
  • Add Carousel touch support via Hammer.js (0b6a4fa)
  • Add useAccordionToggle hook (140ddf7)
  • modulate Popover Components (#3811) (f608c42)
  • Re-implement touch functionality for Carousel natively (b0d2297)

BREAKING CHANGES

  • Popovers now expose sub components Content, Title for building up popovers

1.0.0-beta.9 (2019-05-30)

Bug Fixes

  • Collapse: remove 0px menu height on resize and expand/collapse (#3687) (787a19e)
  • Accordion Component not collapsing when toggled twice (cd842f7), closes #3726
  • ran prettier to fix CI (#3678) (1719da5)
  • types: add bootstrap sizes for Form.Label as column (#3731) (cdb7b6b), closes #3481
  • types: add scrollable to ModalProps interface to match component (#3742) (57e7bf4)
  • types: alignRight type (#3828) (1dd21eb)

Features

  • docs: optimized style and script loading (#3713) (4b362a3)

1.0.0-beta.8 (2019-04-12)

1.0.0-beta.7 (2019-04-12)

Bug Fixes

Features

1.0.0-beta.6 (2019-03-21)

Bug Fixes

Features

1.0.0-beta.5 (2019-01-25)

chore

  • build: clean up build tooling (e71fa89)

BREAKING CHANGES

  • build: remove bower build, use npm
  • build: cherry picked imports no longer have to specify lib in the import

1.0.0-beta.4 (2019-01-18)

Bug Fixes

Features

  • first pass of typescript types for everything (#3411) (2079b22)

1.0.0-beta.3 (2018-11-14)

Bug Fixes

Features

  • add suppoprt for custom checkboxes and radios (#3343) (97a5b2f)

1.0.0-beta.2 (2018-11-07)

Bug Fixes

Features

  • change default Nav components to non ul/li (#3339) (59127e6)

BREAKING CHANGES

  • components no longer default to a list

  • more

  • fix docs

1.0.0-beta.1 (2018-09-14)

Bug Fixes

1.0.0-beta.0 (2018-09-13)