npm - @coreui/react - Versions diffs - 5.7.1 → 5.9.0 - Mend

@coreui/react 5.7.1 → 5.9.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 (838) hide show

package/src/components/footer/CFooter.tsx CHANGED Viewed

@@ -24,7 +24,7 @@ export const CFooter = forwardRef<HTMLDivElement, CFooterProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CFooter.propTypes = {

package/src/components/footer/__tests__/CFooter.spec.tsx CHANGED Viewed

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

package/src/components/form/CForm.tsx CHANGED Viewed

@@ -24,7 +24,7 @@ export const CForm = forwardRef<HTMLFormElement, CFormProps>(
         {children}
       </form>
     )
-  },
+  }
 )
 CForm.propTypes = {

package/src/components/form/CFormCheck.tsx CHANGED Viewed

@@ -103,7 +103,7 @@ export const CFormCheck = forwardRef<HTMLInputElement, CFormCheckProps>(
       valid,
       ...rest
     },
-    ref,
+    ref
   ) => {
     const inputRef = useRef<HTMLInputElement>(null)
     const forkedRef = useForkedRef(ref, inputRef)
@@ -151,9 +151,9 @@ export const CFormCheck = forwardRef<HTMLInputElement, CFormCheckProps>(
                 {
                   [`btn-${button.size}`]: button.size,
                 },
-                `${button.shape}`,
+                `${button.shape}`
               )
-            : 'form-check-label',
+            : 'form-check-label'
         )}
         {...(id && { htmlFor: id })}
       >
@@ -194,7 +194,7 @@ export const CFormCheck = forwardRef<HTMLInputElement, CFormCheckProps>(
                 'is-invalid': invalid,
                 'is-valid': valid,
               },
-              className,
+              className
             )}
           >
             <FormControl />
@@ -208,7 +208,7 @@ export const CFormCheck = forwardRef<HTMLInputElement, CFormCheckProps>(
     }
     return <FormCheck />
-  },
+  }
 )
 CFormCheck.propTypes = {

package/src/components/form/CFormFeedback.tsx CHANGED Viewed

@@ -38,7 +38,7 @@ export const CFormFeedback: PolymorphicRefForwardingComponent<'div', CFormFeedba
               [`invalid-${tooltip ? 'tooltip' : 'feedback'}`]: invalid,
               [`valid-${tooltip ? 'tooltip' : 'feedback'}`]: valid,
             },
-            className,
+            className
           )}
           {...rest}
           ref={ref}
@@ -46,7 +46,7 @@ export const CFormFeedback: PolymorphicRefForwardingComponent<'div', CFormFeedba
           {children}
         </Component>
       )
-    },
+    }
   )
 CFormFeedback.propTypes = {

package/src/components/form/CFormFloating.tsx CHANGED Viewed

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

package/src/components/form/CFormInput.tsx CHANGED Viewed

@@ -76,14 +76,14 @@ export const CFormInput = forwardRef<HTMLInputElement, CFormInputProps>(
       valid,
       ...rest
     },
-    ref,
+    ref
   ) => {
     const [value, setValue] = useState<React.ChangeEvent<HTMLInputElement>>()
     useEffect(() => {
       const timeOutId = setTimeout(
         () => value && onChange && onChange(value),
-        typeof delay === 'number' ? delay : 500,
+        typeof delay === 'number' ? delay : 500
       )
       return () => clearTimeout(timeOutId)
@@ -113,7 +113,7 @@ export const CFormInput = forwardRef<HTMLInputElement, CFormInputProps>(
               'is-invalid': invalid,
               'is-valid': valid,
             },
-            className,
+            className
           )}
           id={id}
           type={type}
@@ -125,7 +125,7 @@ export const CFormInput = forwardRef<HTMLInputElement, CFormInputProps>(
         </input>
       </CFormControlWrapper>
     )
-  },
+  }
 )
 CFormInput.propTypes = {

package/src/components/form/CFormLabel.tsx CHANGED Viewed

@@ -20,7 +20,7 @@ export const CFormLabel = forwardRef<HTMLLabelElement, CFormLabelProps>(
         {children}
       </label>
     )
-  },
+  }
 )
 CFormLabel.propTypes = {

package/src/components/form/CFormRange.tsx CHANGED Viewed

@@ -54,7 +54,7 @@ export const CFormRange = forwardRef<HTMLInputElement, CFormRangeProps>(
         <input type="range" className={classNames('form-range', className)} {...rest} ref={ref} />
       </>
     )
-  },
+  }
 )
 CFormRange.propTypes = {

package/src/components/form/CFormSelect.tsx CHANGED Viewed

@@ -66,7 +66,7 @@ export const CFormSelect = forwardRef<HTMLSelectElement, CFormSelectProps>(
       valid,
       ...rest
     },
-    ref,
+    ref
   ) => {
     return (
       <CFormControlWrapper
@@ -92,7 +92,7 @@ export const CFormSelect = forwardRef<HTMLSelectElement, CFormSelectProps>(
               'is-invalid': invalid,
               'is-valid': valid,
             },
-            className,
+            className
           )}
           size={htmlSize}
           {...rest}
@@ -116,7 +116,7 @@ export const CFormSelect = forwardRef<HTMLSelectElement, CFormSelectProps>(
         </select>
       </CFormControlWrapper>
     )
-  },
+  }
 )
 CFormSelect.propTypes = {

package/src/components/form/CFormSwitch.tsx CHANGED Viewed

@@ -53,7 +53,7 @@ export const CFormSwitch = forwardRef<HTMLInputElement, CFormSwitchProps>(
             'is-invalid': invalid,
             'is-valid': valid,
           },
-          className,
+          className
         )}
       >
         <input
@@ -73,7 +73,7 @@ export const CFormSwitch = forwardRef<HTMLInputElement, CFormSwitchProps>(
         )}
       </div>
     )
-  },
+  }
 )
 CFormSwitch.propTypes = {

package/src/components/form/CFormTextarea.tsx CHANGED Viewed

@@ -54,7 +54,7 @@ export const CFormTextarea = forwardRef<HTMLTextAreaElement, CFormTextareaProps>
       valid,
       ...rest
     },
-    ref,
+    ref
   ) => {
     return (
       <CFormControlWrapper
@@ -78,7 +78,7 @@ export const CFormTextarea = forwardRef<HTMLTextAreaElement, CFormTextareaProps>
               'is-invalid': invalid,
               'is-valid': valid,
             },
-            className,
+            className
           )}
           id={id}
           {...rest}
@@ -88,7 +88,7 @@ export const CFormTextarea = forwardRef<HTMLTextAreaElement, CFormTextareaProps>
         </textarea>
       </CFormControlWrapper>
     )
-  },
+  }
 )
 CFormTextarea.propTypes = {

package/src/components/form/CInputGroup.tsx CHANGED Viewed

@@ -22,7 +22,7 @@ export const CInputGroup = forwardRef<HTMLDivElement, CInputGroupProps>(
           {
             [`input-group-${size}`]: size,
           },
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -30,7 +30,7 @@ export const CInputGroup = forwardRef<HTMLDivElement, CInputGroupProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CInputGroup.propTypes = {

package/src/components/form/CInputGroupText.tsx CHANGED Viewed

@@ -24,7 +24,7 @@ export const CInputGroupText: PolymorphicRefForwardingComponent<'span', CInputGr
           {children}
         </Component>
       )
-    },
+    }
   )
 CInputGroupText.propTypes = {

package/src/components/form/__tests__/CForm.spec.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ test('CForm customize', async () => {
   const { container } = render(
     <CForm className="bazinga" validated={true}>
       Test
-    </CForm>,
+    </CForm>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -30,7 +30,7 @@ test('CForm example', async () => {
       <CButton type="submit" color="primary">
         E
       </CButton>
-    </CForm>,
+    </CForm>
   )
   expect(container).toMatchSnapshot()
 })

package/src/components/form/__tests__/CFormCheck.spec.tsx CHANGED Viewed

@@ -10,7 +10,7 @@ test('loads and displays CFormCheck component', async () => {
 test('CFormCheck customize button=false', async () => {
   const { container } = render(
-    <CFormCheck className="bazinga" id="id" inline={true} label="label" type="radio" />,
+    <CFormCheck className="bazinga" id="id" inline={true} label="label" type="radio" />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -27,7 +27,7 @@ test('CFormCheck customize button=true', async () => {
       inline={true}
       label="label"
       type="radio"
-    />,
+    />
   )
   expect(container).toMatchSnapshot()
 })

package/src/components/form/__tests__/CFormControl.spec.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ test('CFormInput customize', async () => {
       size="lg"
       type="color"
       value="value"
-    />,
+    />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/form/__tests__/CFormFeedback.spec.tsx CHANGED Viewed

@@ -10,7 +10,7 @@ test('loads and displays CFormFeedback component', async () => {
 test('CFormFeedback customize one', async () => {
   const { container } = render(
-    <CFormFeedback className="bazinga" invalid={true} valid={true} tooltip={true} />,
+    <CFormFeedback className="bazinga" invalid={true} valid={true} tooltip={true} />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('invalid-tooltip')
@@ -20,7 +20,7 @@ test('CFormFeedback customize one', async () => {
 test('CFormFeedback customize two', async () => {
   const { container } = render(
-    <CFormFeedback className="bazinga" invalid={true} valid={true} tooltip={false} />,
+    <CFormFeedback className="bazinga" invalid={true} valid={true} tooltip={false} />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('invalid-feedback')

package/src/components/form/__tests__/CFormInput.spec.tsx CHANGED Viewed

@@ -26,7 +26,7 @@ test('CFormInput customize two', async () => {
       type="color"
       valid={true}
       value="#888888"
-    />,
+    />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('form-control-lg')

package/src/components/form/__tests__/CFormRange.spec.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ test('CFormRange customize', async () => {
       min={20}
       readOnly={true}
       value={80}
-    />,
+    />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('form-range')

package/src/components/form/__tests__/CFormSelect.spec.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ test('CFormSelect customize', async () => {
     <CFormSelect className="bazinga" size="lg">
       <option value="A">B</option>
       <option>C</option>
-    </CFormSelect>,
+    </CFormSelect>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/form/__tests__/CFormSwitch.spec.tsx CHANGED Viewed

@@ -18,7 +18,7 @@ test('CFormSwitch customize', async () => {
       size="xl"
       type="radio"
       valid={true}
-    />,
+    />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('form-check')

package/src/components/form/__tests__/CFormText.spec.tsx CHANGED Viewed

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

package/src/components/form/__tests__/CFormTextarea.spec.tsx CHANGED Viewed

@@ -20,7 +20,7 @@ test('CFormTextarea customize', async () => {
       valid={true}
       defaultValue="Some value"
       rows={2}
-    />,
+    />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('form-control-plaintext')

package/src/components/form/__tests__/CInputGroup.spec.tsx CHANGED Viewed

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

package/src/components/form/__tests__/CInputGroupText.spec.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ test('renders CInputGroupText component as a label', async () => {
   const { container } = render(
     <CInputGroupText as="label" htmlFor="input">
       Test
-    </CInputGroupText>,
+    </CInputGroupText>
   )
   expect(container).toMatchSnapshot()
 })

package/src/components/grid/CCol.tsx CHANGED Viewed

@@ -105,7 +105,7 @@ export const CCol = forwardRef<HTMLDivElement, CColProps>(
       <div
         className={classNames(
           repsonsiveClassNames.length > 0 ? repsonsiveClassNames : 'col',
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -113,7 +113,7 @@ export const CCol = forwardRef<HTMLDivElement, CColProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 const span = PropTypes.oneOfType([

package/src/components/grid/CContainer.tsx CHANGED Viewed

@@ -57,7 +57,7 @@ export const CContainer = forwardRef<HTMLDivElement, CContainerProps>(
       <div
         className={classNames(
           repsonsiveClassNames.length > 0 ? repsonsiveClassNames : 'container',
-          className,
+          className
         )}
         {...rest}
         ref={ref}
@@ -65,7 +65,7 @@ export const CContainer = forwardRef<HTMLDivElement, CContainerProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 CContainer.propTypes = {

package/src/components/grid/CRow.tsx CHANGED Viewed

@@ -95,7 +95,7 @@ export const CRow = forwardRef<HTMLDivElement, CRowProps>(
         {children}
       </div>
     )
-  },
+  }
 )
 const bp = PropTypes.shape({

package/src/components/grid/__tests__/CCol.spec.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ test('CCol customize breakpoints are numbers', async () => {
   const { container } = render(
     <CCol className="bazinga" xs={1} sm={2} md={3} lg={4} xl={5} xxl={6}>
       Test
-    </CCol>,
+    </CCol>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -29,7 +29,7 @@ test('CCol customize breakpoints are boolean', async () => {
   const { container } = render(
     <CCol className="bazinga" xs={true} sm={true} md={true} lg={true} xl={true} xxl={true}>
       Test
-    </CCol>,
+    </CCol>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/grid/__tests__/CContainer.spec.tsx CHANGED Viewed

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

package/src/components/grid/__tests__/CRow.spec.tsx CHANGED Viewed

@@ -20,7 +20,7 @@ test('CRow customize cols', async () => {
       xxl={{ cols: 6 }}
     >
       Test
-    </CRow>,
+    </CRow>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -36,7 +36,7 @@ test('CRow customize gutter single gutter', async () => {
   const { container } = render(
     <CRow className="bazinga" xs={{ gutter: 7 }}>
       Test
-    </CRow>,
+    </CRow>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -55,7 +55,7 @@ test('CRow customize gutter', async () => {
       xxl={{ gutter: 6 }}
     >
       Test
-    </CRow>,
+    </CRow>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -79,7 +79,7 @@ test('CRow customize gutterX', async () => {
       xxl={{ gutterX: 6 }}
     >
       Test
-    </CRow>,
+    </CRow>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')
@@ -103,7 +103,7 @@ test('CRow customize gutterY', async () => {
       xxl={{ gutterY: 6 }}
     >
       Test
-    </CRow>,
+    </CRow>
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('bazinga')

package/src/components/header/CHeader.tsx CHANGED Viewed

@@ -34,7 +34,7 @@ export const CHeader = forwardRef<HTMLDivElement, CHeaderProps>(
         )}
       </div>
     )
-  },
+  }
 )
 CHeader.propTypes = {

package/src/components/header/CHeaderDivider.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ export interface CHeaderDividerProps extends HTMLAttributes<HTMLDivElement> {
 export const CHeaderDivider = forwardRef<HTMLDivElement, CHeaderDividerProps>(
   ({ className, ...rest }, ref) => {
     return <div className={classNames('header-divider', className)} {...rest} ref={ref} />
-  },
+  }
 )
 CHeaderDivider.propTypes = {

package/src/components/header/CHeaderText.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CHeaderText = forwardRef<HTMLSpanElement, CHeaderTextProps>(
         {children}
       </span>
     )
-  },
+  }
 )
 CHeaderText.propTypes = {

package/src/components/header/CHeaderToggler.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ export const CHeaderToggler = forwardRef<HTMLButtonElement, CHeaderTogglerProps>
         {children ?? <span className="header-toggler-icon"></span>}
       </button>
     )
-  },
+  }
 )
 CHeaderToggler.propTypes = {

package/src/components/header/__tests__/CHeader.spec.tsx CHANGED Viewed

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

package/src/components/header/__tests__/CHeaderBrand.spec.tsx CHANGED Viewed

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

package/src/components/header/__tests__/CHeaderNav.spec.tsx CHANGED Viewed

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

package/src/components/image/CImage.tsx CHANGED Viewed

@@ -38,14 +38,14 @@ export const CImage = forwardRef<HTMLImageElement, CImageProps>(
               rounded: rounded,
               'img-thumbnail': thumbnail,
             },
-            className,
+            className
           ) || undefined
         }
         {...rest}
         ref={ref}
       />
     )
-  },
+  }
 )
 CImage.propTypes = {

package/src/components/image/__tests__/CImage.spec.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ test('CImage customize one', async () => {
 test('CImage customize two', async () => {
   const { container } = render(
-    <CImage className="bazinga" align="center" fluid={true} rounded={true} thumbnail={true} />,
+    <CImage className="bazinga" align="center" fluid={true} rounded={true} thumbnail={true} />
   )
   expect(container).toMatchSnapshot()
   expect(container.firstChild).toHaveClass('d-block')

package/src/components/index.ts CHANGED Viewed

@@ -13,6 +13,7 @@ export * from './close-button'
 export * from './collapse'
 export * from './conditional-portal'
 export * from './dropdown'
+export * from './focus-trap'
 export * from './footer'
 export * from './form'
 export * from './grid'