refactor(CButton, CHeaderBrand, CLink, ClistGroupItem): update interface

Author: mrholek

packages/coreui-react/src/components/button/CButton.tsx

@@ -1,11 +1,11 @@
-import React, { ButtonHTMLAttributes, ElementType, forwardRef } from 'react'
+import React, { ElementType, forwardRef } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
 import { Colors, Shapes, colorPropType } from '../Types'
-import { CLink } from '../link/CLink'
+import { CLink, CLinkProps } from '../link/CLink'
 
-export interface CButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+export interface CButtonProps extends Omit<CLinkProps, 'size'> {
   /**
    * Toggle the active state for the component.
    */

packages/coreui-react/src/components/header/CHeaderBrand.tsx

@@ -1,8 +1,9 @@
-import React, { ElementType, forwardRef, HTMLAttributes } from 'react'
+import React, { ElementType, forwardRef, AnchorHTMLAttributes } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
-export interface CHeaderBrandProps extends HTMLAttributes<HTMLAnchorElement | HTMLSpanElement> {
+export interface CHeaderBrandProps
+  extends AnchorHTMLAttributes<HTMLAnchorElement | HTMLSpanElement> {
   /**
    * A string of all className you want applied to the component.
    */

packages/coreui-react/src/components/link/CLink.tsx

@@ -2,7 +2,7 @@ import React, { AllHTMLAttributes, ElementType, forwardRef, MouseEvent } from 'r
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
-export interface CLinkProps extends AllHTMLAttributes<HTMLElement> {
+export interface CLinkProps extends AllHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {
   /**
    * Toggle the active state for the component.
    */
@@ -36,7 +36,7 @@ export const CLink = forwardRef<HTMLButtonElement | HTMLAnchorElement, CLinkProp
         {...(active && { 'aria-current': 'page' })}
         {...(Component === 'a' && disabled && { 'aria-disabled': true, tabIndex: -1 })}
         {...((Component === 'a' || Component === 'button') && {
-          onClick: (event: MouseEvent<HTMLElement>) => {
+          onClick: (event: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {
             event.preventDefault
             !disabled && rest.onClick && rest.onClick(event)
           },

packages/coreui-react/src/components/list-group/CListGroupItem.tsx

@@ -1,12 +1,12 @@
-import React, { ElementType, HTMLAttributes, forwardRef } from 'react'
+import React, { ElementType, AnchorHTMLAttributes, forwardRef } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
 import { Colors, colorPropType } from '../Types'
 import { CLink } from '../link/CLink'
 
 export interface CListGroupItemProps
-  extends HTMLAttributes<HTMLLIElement | HTMLAnchorElement | HTMLButtonElement> {
+  extends AnchorHTMLAttributes<HTMLLIElement | HTMLAnchorElement | HTMLButtonElement> {
   /**
    * Toggle the active state for the component.
    */