npm - @coreui/react - Versions diffs - 5.7.0 → 5.8.0 - Mend

@coreui/react 5.7.0 → 5.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (848) hide show

package/src/components/accordion/CAccordionHeader.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ export const CAccordionHeader = forwardRef<HTMLDivElement, CAccordionHeaderProps
         <CAccordionButton>{children}</CAccordionButton>
       </div>
     )
-  },
+  }
 )
 CAccordionHeader.propTypes = {

package/src/components/alert/CAlert.tsx CHANGED Viewed

@@ -50,7 +50,7 @@ export const CAlert = forwardRef<HTMLDivElement, CAlertProps>(
       onClose,
       ...rest
     },
-    ref,
+    ref
   ) => {
     const alertRef = useRef<HTMLDivElement>(null)
     const forkedRef = useForkedRef(ref, alertRef)
@@ -78,7 +78,7 @@ export const CAlert = forwardRef<HTMLDivElement, CAlertProps>(
                 'alert-dismissible fade': dismissible,
                 show: state === 'entered',
               },
-              className,
+              className
             )}
             role="alert"
             {...rest}
@@ -90,7 +90,7 @@ export const CAlert = forwardRef<HTMLDivElement, CAlertProps>(
         )}
       </Transition>
     )
-  },
+  }
 )
 CAlert.propTypes = {

package/src/components/alert/CAlertHeading.tsx CHANGED Viewed

@@ -23,7 +23,7 @@ export const CAlertHeading: PolymorphicRefForwardingComponent<'h4', CAlertHeadin
           {children}
         </Component>
       )
-    },
+    }
   )
 CAlertHeading.propTypes = {

package/src/components/alert/CAlertLink.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ export const CAlertLink = forwardRef<HTMLAnchorElement, CAlertLinkProps>(
         {children}
       </CLink>
     )
-  },
+  }
 )
 CAlertLink.propTypes = {

package/src/components/alert/__tests__/CAlertHeading.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CAlertHeading customize', async () => {
   const { container } = render(
     <CAlertHeading as="h3" className="bazinga">
       Test
-    </CAlertHeading>,
+    </CAlertHeading>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/alert/__tests__/CAlertLink.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CAlertLink customize', async () => {
   const { container } = render(
     <CAlertLink className="bazinga" href="/bazinga">
       Test
-    </CAlertLink>,
+    </CAlertLink>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/avatar/CAvatar.tsx CHANGED Viewed

@@ -58,7 +58,7 @@ export const CAvatar = forwardRef<HTMLDivElement, CAvatarProps>(
             [`text-${textColor}`]: textColor,
           },
           shape,
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -67,7 +67,7 @@ export const CAvatar = forwardRef<HTMLDivElement, CAvatarProps>(
         {status && <span className={statusClassName}></span>}
       </div>
     )
-  },
+  }
 )
 CAvatar.propTypes = {

package/src/components/avatar/__tests__/CAvatar.spec.tsx CHANGED Viewed

@@ -20,7 +20,7 @@ test('CAvatar customize', async () => {
       textColor="white"
     >
       Test
-    </CAvatar>,
+    </CAvatar>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -45,7 +45,7 @@ test('CAvatar customize image', async () => {
       src="/bazinga"
     >
       Test
-    </CAvatar>,
+    </CAvatar>
   )
   expect(container).toMatchSnapshot()

package/src/components/backdrop/CBackdrop.tsx CHANGED Viewed

@@ -34,7 +34,7 @@ export const CBackdrop = forwardRef<HTMLDivElement, CBackdropProps>(
         )}
       </Transition>
     )
-  },
+  }
 )
 CBackdrop.propTypes = {

package/src/components/backdrop/__tests__/CBackdrop.spec.tsx CHANGED Viewed

@@ -22,7 +22,7 @@ test('CBackdrop customize 2', async () => {
   const { container } = render(
     <CBackdrop className="bazinga" visible={true}>
       Test
-    </CBackdrop>,
+    </CBackdrop>
   )
   jest.runAllTimers()
   expect(container).toMatchSnapshot()

package/src/components/badge/CBadge.tsx CHANGED Viewed

@@ -66,7 +66,7 @@ export const CBadge: PolymorphicRefForwardingComponent<'span', CBadgeProps> = fo
       textColor,
       ...rest
     },
-    ref,
+    ref
   ) => {
     return (
       <Component
@@ -84,7 +84,7 @@ export const CBadge: PolymorphicRefForwardingComponent<'span', CBadgeProps> = fo
             [`text-bg-${textBgColor}`]: textBgColor,
           },
           shape,
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -92,7 +92,7 @@ export const CBadge: PolymorphicRefForwardingComponent<'span', CBadgeProps> = fo
         {children}
       </Component>
     )
-  },
+  }
 )
 CBadge.propTypes = {

package/src/components/badge/__tests__/CBadge.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CBadge customize', async () => {
   const { container } = render(
     <CBadge className="bazinga" color="warning" as="div" shape="rounded" textColor="white">
       Test
-    </CBadge>,
+    </CBadge>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/breadcrumb/CBreadcrumb.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ export const CBreadcrumb = forwardRef<HTMLOListElement, CBreadcrumbProps>(
         </ol>
       </nav>
     )
-  },
+  }
 )
 CBreadcrumb.propTypes = {

package/src/components/breadcrumb/CBreadcrumbItem.tsx CHANGED Viewed

@@ -37,7 +37,7 @@ export const CBreadcrumbItem: PolymorphicRefForwardingComponent<'li', CBreadcrum
             {
               active: active,
             },
-            className,
+            className
           )}
           {...(active && { 'aria-current': 'page' })}
           {...rest}
@@ -52,7 +52,7 @@ export const CBreadcrumbItem: PolymorphicRefForwardingComponent<'li', CBreadcrum
           )}
         </li>
       )
-    },
+    }
   )
 CBreadcrumbItem.propTypes = {

package/src/components/breadcrumb/__tests__/CBreadcrumb.spec.tsx CHANGED Viewed

@@ -14,7 +14,7 @@ test('CBreadcrumb customize', async () => {
       <CBreadcrumbItem>Test A</CBreadcrumbItem>
       <CBreadcrumbItem active={false}>Test B</CBreadcrumbItem>
       <CBreadcrumbItem active={true}>Test C</CBreadcrumbItem>
-    </CBreadcrumb>,
+    </CBreadcrumb>
   )
   const ol = container.querySelector('ol')
   expect(container).toMatchSnapshot()

package/src/components/breadcrumb/__tests__/CBreadcrumbItem.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CBreadcrumbItem customize', async () => {
   const { container } = render(
     <CBreadcrumbItem active={true} className="bazinga">
       Test
-    </CBreadcrumbItem>,
+    </CBreadcrumbItem>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/button/CButton.tsx CHANGED Viewed

@@ -74,9 +74,10 @@ export const CButton: PolymorphicRefForwardingComponent<'button', CButtonProps>
         {...(!rest.href && { type: type })}
         className={classNames(
           'btn',
-          variant && color ? `btn-${variant}-${color}` : `btn-${variant}`,
           {
-            [`btn-${color}`]: color && !variant,
+            [`btn-${variant}-${color}`]: variant && color,
+            [`btn-${variant}`]: variant && !color,
+            [`btn-${color}`]: !variant && color,
             [`btn-${size}`]: size,
           },
           shape,

package/src/components/button/__tests__/CButton.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CButton customize witch href', async () => {
   const { container } = render(
     <CButton color="primary" as="span" href="/bazinga">
       Test
-    </CButton>,
+    </CButton>
   )
   expect(container).toMatchSnapshot()
 })
@@ -32,7 +32,7 @@ test('CButton customize', async () => {
       variant="ghost"
     >
       Test
-    </CButton>,
+    </CButton>
   )
   expect(container).toMatchSnapshot()

package/src/components/button-group/CButtonGroup.tsx CHANGED Viewed

@@ -24,7 +24,7 @@ export const CButtonGroup = forwardRef<HTMLDivElement, CButtonGroupProps>(
         className={classNames(
           vertical ? 'btn-group-vertical' : 'btn-group',
           { [`btn-group-${size}`]: size },
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -32,7 +32,7 @@ export const CButtonGroup = forwardRef<HTMLDivElement, CButtonGroupProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CButtonGroup.propTypes = {

package/src/components/button-group/CButtonToolbar.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CButtonToolbar = forwardRef<HTMLDivElement, CButtonToolbarProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CButtonToolbar.propTypes = {

package/src/components/button-group/__tests__/CButtonGroup.spec.tsx CHANGED Viewed

@@ -15,7 +15,7 @@ test('CButtonGroup customize', async () => {
       <CButton color="primary">Test A</CButton>
       <CButton color="primary">Test B</CButton>
       <CButton color="primary">Test C</CButton>
-    </CButtonGroup>,
+    </CButtonGroup>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -29,7 +29,7 @@ test('CButtonGroup customize vertical', async () => {
       <CButton color="primary">Test A</CButton>
       <CButton color="primary">Test B</CButton>
       <CButton color="primary">Test C</CButton>
-    </CButtonGroup>,
+    </CButtonGroup>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/button-group/__tests__/CButtonToolbar.spec.tsx CHANGED Viewed

@@ -22,7 +22,7 @@ test('CButtonToolbar customize', async () => {
         <CButton color="primary">B</CButton>
         <CButton color="primary">C</CButton>
       </CButtonGroup>
-    </CButtonToolbar>,
+    </CButtonToolbar>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/callout/CCallout.tsx CHANGED Viewed

@@ -27,7 +27,7 @@ export const CCallout = forwardRef<HTMLDivElement, CCalloutProps>(
           {
             [`callout-${color}`]: color,
           },
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -35,7 +35,7 @@ export const CCallout = forwardRef<HTMLDivElement, CCalloutProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CCallout.propTypes = {

package/src/components/callout/__tests__/CCallout.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCallout customize', async () => {
   const { container } = render(
     <CCallout className="bazinga" color="primary">
       Test
-    </CCallout>,
+    </CCallout>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/card/CCard.tsx CHANGED Viewed

@@ -42,7 +42,7 @@ export const CCard = forwardRef<HTMLDivElement, CCardProps>(
             [`text-${textColor}`]: textColor,
             [`text-bg-${textBgColor}`]: textBgColor,
           },
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -50,7 +50,7 @@ export const CCard = forwardRef<HTMLDivElement, CCardProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CCard.propTypes = {

package/src/components/card/CCardBody.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CCardBody = forwardRef<HTMLDivElement, CCardBodyProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CCardBody.propTypes = {

package/src/components/card/CCardFooter.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CCardFooter = forwardRef<HTMLDivElement, CCardFooterProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CCardFooter.propTypes = {

package/src/components/card/CCardGroup.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CCardGroup = forwardRef<HTMLDivElement, CCardGroupProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CCardGroup.propTypes = {

package/src/components/card/CCardImageOverlay.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CCardImageOverlay = forwardRef<HTMLDivElement, CCardImageOverlayPro
         {children}
       </div>
     )
-  },
+  }
 )
 CCardImageOverlay.propTypes = {

package/src/components/card/CCardLink.tsx CHANGED Viewed

@@ -22,7 +22,7 @@ export const CCardLink = forwardRef<HTMLAnchorElement, CCardLinkProps>(
         {children}
       </CLink>
     )
-  },
+  }
 )
 CCardLink.propTypes = {

package/src/components/card/CCardSubtitle.tsx CHANGED Viewed

@@ -23,7 +23,7 @@ export const CCardSubtitle: PolymorphicRefForwardingComponent<'h6', CCardSubtitl
           {children}
         </Component>
       )
-    },
+    }
   )
 CCardSubtitle.propTypes = {

package/src/components/card/__tests__/CCard.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCard customize', async () => {
   const { container } = render(
     <CCard className="bazinga" color="primary" textColor="warning">
       Test
-    </CCard>,
+    </CCard>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/card/__tests__/CCardGroup.spec.tsx CHANGED Viewed

@@ -45,7 +45,7 @@ test('CCardGroup full example', async () => {
           <CCardTitle>Card Title</CCardTitle>
         </CCardBody>
       </CCard>
-    </CCardGroup>,
+    </CCardGroup>
   )
   expect(container).toMatchSnapshot()
 })

package/src/components/card/__tests__/CCardHeader.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCardHeader customize', async () => {
   const { container } = render(
     <CCardHeader className="bazinga" as="h3">
       Test
-    </CCardHeader>,
+    </CCardHeader>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/card/__tests__/CCardLink.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCardLink customize', async () => {
   const { container } = render(
     <CCardLink className="bazinga" href="/bazinga">
       Test
-    </CCardLink>,
+    </CCardLink>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/card/__tests__/CCardSubtitle.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCardSubtitle customize', async () => {
   const { container } = render(
     <CCardSubtitle className="bazinga" as="h3">
       Test
-    </CCardSubtitle>,
+    </CCardSubtitle>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/card/__tests__/CCardText.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCardText customize', async () => {
   const { container } = render(
     <CCardText className="bazinga" as="h3">
       Test
-    </CCardText>,
+    </CCardText>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/card/__tests__/CCardTitle.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('CCardTitle customize', async () => {
   const { container } = render(
     <CCardTitle className="bazinga" as="h3">
       Test
-    </CCardTitle>,
+    </CCardTitle>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/carousel/__tests__/CCarousel.spec.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ test('loads and displays CCarousel component', async () => {
         Item-3
         <CCarouselCaption>Caption-3</CCarouselCaption>
       </CCarouselItem>
-    </CCarousel>,
+    </CCarousel>
   )
   const carousel = document.querySelector('.carousel')
@@ -74,7 +74,7 @@ test('CCarousel click on indicator', async () => {
         Item-3
         <CCarouselCaption>Caption-3</CCarouselCaption>
       </CCarouselItem>
-    </CCarousel>,
+    </CCarousel>
   )
   const item1 = getByText(container, 'Item-1')
   const item2 = getByText(container, 'Item-2')
@@ -118,7 +118,7 @@ test('CCarousel click on button', async () => {
         Item-3
         <CCarouselCaption>Caption-3</CCarouselCaption>
       </CCarouselItem>
-    </CCarousel>,
+    </CCarousel>
   )
   const item1 = getByText(container, 'Item-1')
   const item2 = getByText(container, 'Item-2')

package/src/components/close-button/CCloseButton.tsx CHANGED Viewed

@@ -35,7 +35,7 @@ export const CCloseButton = forwardRef<HTMLButtonElement, CCloseButtonProps>(
             'btn-close-white': white,
           },
           disabled,
-          className,
+          className
         )}
         aria-label="Close"
         disabled={disabled}
@@ -44,7 +44,7 @@ export const CCloseButton = forwardRef<HTMLButtonElement, CCloseButtonProps>(
         ref={ref}
       />
     )
-  },
+  }
 )
 CCloseButton.propTypes = {

package/src/components/collapse/CCollapse.tsx CHANGED Viewed

@@ -111,7 +111,7 @@ export const CCollapse = forwardRef<HTMLDivElement, CCollapseProps>(
         }}
       </CSSTransition>
     )
-  },
+  }
 )
 CCollapse.propTypes = {