Skip to content

Commit 6d23d9f

Browse files
committed
docs(v5): add migration docs
Mainly just a copy/paste of the previous migration docs, along with a brief summary of the breaking changes so far.
1 parent 252cd4e commit 6d23d9f

File tree

1 file changed

+23
-118
lines changed

1 file changed

+23
-118
lines changed

www/src/pages/migrating.mdx

Lines changed: 23 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -1,145 +1,50 @@
1-
# Migrating to v1
1+
# Migrating to v2
22

3-
React Bootstrap v1 adds full compatibility with Bootstrap 4. Because bootstrap 4 is a major rewrite of the project there
4-
are significant breaking changes from the pre `v1` react-bootstrap.
3+
React Bootstrap v2 adds full compatibility with Bootstrap 5. Because bootstrap 5 is a major rewrite of the project there
4+
are significant breaking changes from v1 React Bootstrap.
55

66
**PLEASE FIRST READ THE UPSTREAM BOOSTRAP MIGRATION GUIDE**
77

8-
> https://getbootstrap.com/docs/4.3/migration/
8+
> https://v5.getbootstrap.com/docs/5.0/migration
99
10-
React-Bootstrap _only_ contains components that are present in vanilla Bootstrap. If functionality
10+
React Bootstrap _only_ contains components that are present in vanilla Bootstrap. If functionality
1111
was removed from Bootstrap, then it was also removed from React-Bootstrap. This guide does not
12-
repeat information found in the upstream migration guide. Its goal is to document React-Bootstrap-specific
12+
repeat information found in the upstream migration guide. Its goal is to document React Bootstrap-specific
1313
API changes and additions.
1414

1515
## Versioning
1616

17-
We will continue to provide general maintenance for Bootstrap 3 components, because there are many projects that continue to depend on Bootstrap 3 support in
17+
We will continue to provide general maintenance for Bootstrap 4 components, because there are many projects that continue to depend on Bootstrap 4 support in
1818
`react-bootstrap`. `react-bootstrap` package versions will be as follows:
1919

2020
- Bootstrap 3 support will continue in react-bootstrap versions < `v1.0.0`
2121
- Bootstrap 4 support will be in react-bootstrap versions >= `v1.0.0`
22+
- Bootstrap 5 support will be in react-bootstrap versions >= `v2.0.0`
2223

2324
We are **not** committing to keeping breaking changes in lockstep with bootstraps major releases,
24-
there may be a react-bootstrap v2 targeting Bootstrap v4 depending on what's best for the project.
25+
there may be a react-bootstrap v3 targeting Bootstrap 6 depending on what's best for the project.
2526

26-
## Summary of breaking changes from v0.32.0
27+
## Summary of breaking changes from v1.0.0
2728

2829
Below is a _rough_ account of the breaking API changes as well as the minimal change to migrate
2930

30-
- `bsStyle` -> `variant`
31-
- `bsClass` -> `bsPrefix`
32-
- `bsRole` has been removed from all components. Components now communicate
33-
via context to allow intermediate nesting of child components
34-
- `componentClass` -> `as`
35-
- All utils have been removed from main exports, most were internal already and the rest have been moved to external libraries
31+
### FormCheck
3632

37-
### Grid
33+
- deprecated `bsCustomPrefix` and `custom` in favor of `bsSwitchPrefix`.
3834

39-
- renamed to Container
40-
- removed Clearfix
35+
#### FormCheckInput
4136

42-
#### Col
37+
- removed `bsCustomPrefix`.
38+
- removed `isStatic`.
4339

44-
- removed visibility props
45-
- consolidated col `span`, `offset`, and `order` into an object value prop per breakpoint.
40+
#### FormCheckLabel
4641

47-
### Navbar
42+
- removed `bsCustomPrefix`.
43+
- changed base class from `form-check-input` to `form-check-label`.
4844

49-
- removed `Navbar.Header`
50-
- removed `Navbar.Form`
51-
- removed `fluid`, use your own `Container` component in.
52-
- `inverse` removed and replaced with `variant="dark"`
53-
- positioning props have been consolidated into `fixed={top|bottom}` and `sticky={top|bottom}`, staticTop has been removed
45+
### FormControl
5446

55-
#### NavbarHeader
56-
57-
- removed, not present in v4
58-
59-
#### NavbarToggle
60-
61-
- name changed to `Navbar.Toggle`
62-
63-
#### NavbarBrand
64-
65-
- Renders a `<a>` when an `href` is provided
66-
- The presence of `children` does not skip the wrapping `span`, use `as` along with `children` for custom rendering
67-
68-
### Nav
69-
70-
- `activeHref` is removed (only activeKey now)
71-
- `bsStyle` renamed to `variant`
72-
- NavLink hrefs will be used as `eventKey`s when `eventKey` is absent
73-
- Local `onSelect` handlers are ignored when in the context of a TabContainer or Navbar (MAYBE ADD BACK?)
74-
75-
#### Nav.Item
76-
77-
- Renders _only_ the outer "item" element, use inconjunction with the new `NavLink` component
78-
- default element changed to `<div>` from a `<li>`
79-
- `active` prop removed and moved to `NavLink`
80-
81-
### InputGroup
82-
83-
- removed InputGroup.Button, and InputGroup.Addon
84-
- added InputGroup.Prepend, InputGroup.Append, InputGroup.Text, InputGroup.Checkbox, InputGroup.Radio
85-
86-
### Badge & Label
87-
88-
- removed `Label`, the `Badge` component covers both
89-
- `bsStyle` renamed to `variant`
90-
91-
### Panel
92-
93-
- removed, replaced with Card components
94-
95-
### Dropdown
96-
97-
- Removed the `disabled` prop on Dropdown, pass it directly to Dropdown.Toggle
98-
- Removed bsRole, use function children to render custom Toggles or Menus
99-
- Removed SplitButton.toggle (replaced with a `split` prop on the basic Toggle)
100-
- `noCaret` is removed because it's not optional with the styles anymore
101-
- bsPrefixes are not passed from the parent Dropdown anymore
102-
- onSelect behavior is now passed to Menu and Toggle via the Context api
103-
- DropdownMenu is not rendered until opened
104-
- `divider` has been split out into `Dropdown.Divider`
105-
- `header` has been split out into `Dropdown.Header`
106-
107-
#### DropdownButton
108-
109-
- Extra props are passed to the underlying Dropdown component, not the Toggle.
110-
111-
#### SplitButton
112-
113-
- Extra props are passed to the underlying Dropdown component, not the Toggle.
114-
115-
### NavButton
116-
117-
- Extra props are passed to the underlying Dropdown component, not the Toggle.
118-
119-
#### MenuItem
120-
121-
- renamed to `DropdownItem` (also exported on `Dropdown` as `Dropdown.Item`)
122-
123-
### Alert
124-
125-
- `onDismiss` renamed to `onClose`
126-
127-
### Well
128-
129-
- removed.
130-
131-
### Pager
132-
133-
- removed.
134-
135-
### ControlLabel
136-
137-
- renamed to `FormLabel` (also exported on `Form` as `Form.Label`)
138-
139-
### Checkbox and Radio
140-
141-
- Consolidated into a single component. Component's name is `FormCheck` (also exported on `Form` as `Form.Check`)
142-
143-
### Glyphicon
144-
145-
- Removed -- icons are not included in Bootstrap 4. Icon support can be provided via react-icons, fontawesome, or a similar external library.
47+
- dropped `as` prop supporting `select` tags in favor of FormSelect.
48+
- removed `custom`.
49+
- removed `bsCustomPrefix`.
50+
- dropped support for `type` supporting the `range` value in favor of FormRange.

0 commit comments

Comments
 (0)