feat(bs5): update badge classes (#2117)

`badge-*` -> `bg-*` `badge-pill` -> `rounded-pill` Co-authored-by: Adina Johnson <adina.johnson@appfolio.com>
reactstrap · Oct 27, 2021 · 34cdaba · 34cdaba
1 parent 95e6600
commit 34cdaba
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/src/Badge.js b/src/Badge.js
@@ -33,8 +33,8 @@ const Badge = (props) => {
   const classes = mapToCssModules(classNames(
     className,
     'badge',
-    'badge-' + color,
-    pill ? 'badge-pill' : false
+    'bg-' + color,
+    pill ? 'rounded-pill' : false
   ), cssModule);
 
   if (attributes.href && Tag === 'span') {

diff --git a/src/__tests__/Badge.spec.js b/src/__tests__/Badge.spec.js
@@ -30,18 +30,18 @@ describe('Badge', () => {
   it('should render badges with secondary color', () => {
     const wrapper = shallow(<Badge>Default Badge</Badge>);
 
-    expect(wrapper.hasClass('badge-secondary')).toBe(true);
+    expect(wrapper.hasClass('bg-secondary')).toBe(true);
   });
 
   it('should render Badges with other colors', () => {
     const wrapper = shallow(<Badge color="danger">Danger Badge</Badge>);
 
-    expect(wrapper.hasClass('badge-danger')).toBe(true);
+    expect(wrapper.hasClass('bg-danger')).toBe(true);
   });
 
   it('should render Badges as pills', () => {
     const wrapper = shallow(<Badge pill>Pill Badge</Badge>);
 
-    expect(wrapper.hasClass('badge-pill')).toBe(true);
+    expect(wrapper.hasClass('rounded-pill')).toBe(true);
   });
 });