@coreui/react 4.2.0 → 4.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/react",
-  "version": "4.2.0",
+  "version": "4.2.3",
   "description": "UI Components Library for React.js",
   "keywords": [
     "react",
@@ -36,27 +36,27 @@
   },
   "devDependencies": {
     "@popperjs/core": "^2.11.5",
-    "@rollup/plugin-commonjs": "^21.0.3",
-    "@rollup/plugin-node-resolve": "^13.1.3",
-    "@rollup/plugin-typescript": "^8.3.1",
+    "@rollup/plugin-commonjs": "^22.0.0",
+    "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-typescript": "^8.3.3",
     "@testing-library/jest-dom": "^5.16.4",
-    "@testing-library/react": "^12.1.4",
-    "@types/react": "17.0.39",
-    "@types/react-dom": "^17.0.15",
-    "@types/react-transition-group": "^4.4.4",
+    "@testing-library/react": "^13.3.0",
+    "@types/react": "18.0.14",
+    "@types/react-dom": "^18.0.5",
+    "@types/react-transition-group": "^4.4.5",
     "classnames": "^2.3.1",
     "prop-types": "^15.8.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-popper": "^2.2.5",
     "react-transition-group": "^4.4.2",
-    "rollup": "^2.70.1",
+    "rollup": "^2.75.7",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "tslib": "^2.4.0",
-    "typescript": "^4.6.3"
+    "typescript": "^4.7.4"
   },
   "peerDependencies": {
-    "react": "^17",
-    "react-dom": "^17"
+    "react": ">=17",
+    "react-dom": ">=17"
   }
 }

package/src/components/card/CCardImage.tsx

@@ -1,9 +1,9 @@
-import React, { ElementType, forwardRef, HTMLAttributes } from 'react'
+import React, { ElementType, forwardRef, ImgHTMLAttributes } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
 export interface CCardImageProps
-  extends HTMLAttributes<HTMLImageElement | HTMLOrSVGElement | HTMLOrSVGImageElement> {
+  extends ImgHTMLAttributes<HTMLImageElement | HTMLOrSVGElement | HTMLOrSVGImageElement> {
   /**
    * A string of all className you want applied to the base component.
    */

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

@@ -29,7 +29,14 @@ export const CCloseButton = forwardRef<HTMLButtonElement, CCloseButtonProps>(
       className,
     )
     return (
-      <button className={_className} aria-label="Close" disabled={disabled} {...rest} ref={ref} />
+      <button
+        type="button"
+        className={_className}
+        aria-label="Close"
+        disabled={disabled}
+        {...rest}
+        ref={ref}
+      />
     )
   },
 )

package/src/components/form/CFormTextarea.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEventHandler, forwardRef, InputHTMLAttributes } from 'react'
+import React, { ChangeEventHandler, forwardRef, TextareaHTMLAttributes } from 'react'
 
 import classNames from 'classnames'
 import PropTypes from 'prop-types'
@@ -7,7 +7,7 @@ import { CFormControlWrapper, CFormControlWrapperProps } from './CFormControlWra
 
 export interface CFormTextareaProps
   extends CFormControlWrapperProps,
-    InputHTMLAttributes<HTMLTextAreaElement> {
+    TextareaHTMLAttributes<HTMLTextAreaElement> {
   /**
    * A string of all className you want applied to the component.
    */
@@ -78,7 +78,7 @@ export const CFormTextarea = forwardRef<HTMLTextAreaElement, CFormTextareaProps>
         tooltipFeedback={tooltipFeedback}
         valid={valid}
       >
-        <textarea className={_className} {...rest} ref={ref}>
+        <textarea className={_className} id={id} {...rest} ref={ref}>
           {children}
         </textarea>
       </CFormControlWrapper>

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

@@ -19,6 +19,7 @@ test('CFormTextarea customize', async () => {
       readOnly={true}
       valid={true}
       defaultValue="Some value"
+      rows={2}
     />,
   )
   expect(container).toMatchSnapshot()

package/src/components/modal/CModal.tsx

@@ -193,7 +193,7 @@ export const CModal = forwardRef<HTMLDivElement, CModalProps>(
     }
 
     const handleKeyDown = useCallback(
-      (event) => {
+      (event: KeyboardEvent) => {
         if (event.key === 'Escape' && keyboard) {
           return handleDismiss()
         }

package/src/components/offcanvas/COffcanvas.tsx

@@ -107,7 +107,7 @@ export const COffcanvas = forwardRef<HTMLDivElement, COffcanvasProps>(
     }
 
     const handleKeyDown = useCallback(
-      (event) => {
+      (event: React.KeyboardEvent<HTMLDivElement>) => {
         if (event.key === 'Escape' && keyboard) {
           return handleDismiss()
         }

package/src/components/popover/__tests__/__snapshots__/CPopover.spec.tsx.snap

@@ -9,7 +9,7 @@ exports[`CPopover customize 1`] = `
     Test
   </button>
   <div
-    class="popover bs-popover-end fade show"
+    class="popover bs-popover-end fade"
     role="tooltip"
     style="position: absolute; left: 0px; top: 0px;"
   >

package/src/components/table/CTable.tsx

@@ -4,7 +4,7 @@ import classNames from 'classnames'
 
 import { Colors, colorPropType } from '../Types'
 
-export interface CTableProps extends TableHTMLAttributes<HTMLTableElement> {
+export interface CTableProps extends Omit<TableHTMLAttributes<HTMLTableElement>, 'align'> {
   /**
    * Set the vertical aligment.
    */