refactor: change widget names

Author: mrholek

docs/4.0/components/CWidgets.mdx

@@ -19,25 +19,25 @@ import {
   CDropdownToggle,
   CLink,
   CRow,
-  CWidgetA,
-  CWidgetB,
-  CWidgetC,
-  CWidgetD,
-  CWidgetE,
-  CWidgetF,
+  CWidgetStatsA,
+  CWidgetStatsB,
+  CWidgetStatsC,
+  CWidgetStatsD,
+  CWidgetStatsE,
+  CWidgetStatsF,
 } from '../../../src/index.ts'
 
 
 ## Examples
 
 React Alert is prepared for any length of text, as well as an optional close button. For a styling, use one of the **required** contextual `color` props (e.g., `primary`). For inline dismissal, use the [dismissing prop](#dismissing).
 
-## CWidgetA
+## CWidgetStatsA
 
 <Playground>
   <CRow>
     <CCol sm={6}>
-      <CWidgetA
+      <CWidgetStatsA
         className="mb-4"
         color="primary"
         value={<>$9.000 <span className="fs-6 fw-normal">(40.9% <CIcon icon={cilArrowTop} />)</span></>}
@@ -117,7 +117,7 @@ React Alert is prepared for any length of text, as well as an optional close but
       />
     </CCol>
     <CCol sm={6}>
-      <CWidgetA
+      <CWidgetStatsA
         className="mb-4"
         color="info"
         value={<>$9.000 <span className="fs-6 fw-normal">(40.9% <CIcon icon={cilArrowTop} />)</span></>}
@@ -196,7 +196,7 @@ React Alert is prepared for any length of text, as well as an optional close but
       />
     </CCol>
     <CCol sm={6}>
-      <CWidgetA
+      <CWidgetStatsA
         className="mb-4"
         color="warning"
         value={<>$9.000 <span className="fs-6 fw-normal">(40.9% <CIcon icon={cilArrowTop} />)</span></>}
@@ -262,7 +262,7 @@ React Alert is prepared for any length of text, as well as an optional close but
       />
     </CCol>
     <CCol sm={6}>
-      <CWidgetA
+      <CWidgetStatsA
         className="mb-4"
         color="danger"
         value={<>$9.000 <span className="fs-6 fw-normal">(40.9% <CIcon icon={cilArrowTop} />)</span></>}
@@ -349,20 +349,20 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
 </Playground>
 
-## CWidgetB
+## CWidgetStatsB
 
 <Playground>
   <CRow>
     <CCol xs={6}>
-      <CWidgetB
+      <CWidgetStatsB
         className="mb-3"
         progress={{ color: 'success', value: 75 }}
         text="Widget helper text"
         title="Widget title"
         value="89.9%"/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetB
+      <CWidgetStatsB
         className="mb-3"
         color="primary"
         inverse
@@ -374,12 +374,12 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
 </Playground>
 
-## CWidgetC
+## CWidgetStatsC
 
 <Playground>
   <CRow>
     <CCol xs={6}>
-      <CWidgetC
+      <CWidgetStatsC
         className="mb-3"
         icon={<CIcon icon={cilChartPie} height={36} />}
         progress={{ color: 'success', value: 75 }}
@@ -388,7 +388,7 @@ React Alert is prepared for any length of text, as well as an optional close but
         value="89.9%"/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetC
+      <CWidgetStatsC
         className="mb-3"
         icon={<CIcon icon={cilChartPie} height={36} />}
         color="primary"
@@ -401,12 +401,12 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
 </Playground>
 
-## CWidgetD
+## CWidgetStatsD
 
 <Playground>
   <CRow>
     <CCol xs={6}>
-      <CWidgetD
+      <CWidgetStatsD
         className="mb-3"
         icon={<CIcon className="my-4 text-white" icon={cibFacebook} height={52} />}
         chart={
@@ -461,7 +461,7 @@ React Alert is prepared for any length of text, as well as an optional close but
         ]}/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetD
+      <CWidgetStatsD
         className="mb-3"
         icon={<CIcon className="my-4 text-white" icon={cibTwitter} height={52} />}
         chart={
@@ -518,12 +518,12 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
 </Playground>
 
-## CWidgetE
+## CWidgetStatsE
 
 <Playground>
   <CRow>
     <CCol xs={6}>
-      <CWidgetE
+      <CWidgetStatsE
         className="mb-3"
         chart={
           <CChartBar
@@ -562,7 +562,7 @@ React Alert is prepared for any length of text, as well as an optional close but
         value="89.9%"/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetE
+      <CWidgetStatsE
         className="mb-3"
         chart={
           <CChartLine
@@ -611,20 +611,20 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
 </Playground>
 
-## CWidgetF
+## CWidgetStatsF
 
 <Playground>
   <CRow>
     <CCol xs={6}>
-      <CWidgetF
+      <CWidgetStatsF
         className="mb-3"
         color="primary"
         icon={<CIcon icon={cilChartPie} height={24} />}
         title="Widget title"
         value="89.9%"/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetF
+      <CWidgetStatsF
         className="mb-3"
         color="warning"
         icon={<CIcon icon={cilChartPie} height={24} />}
@@ -634,7 +634,7 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
   <CRow>
     <CCol xs={6}>
-      <CWidgetF
+      <CWidgetStatsF
         className="mb-3"
         color="primary"
         icon={<CIcon icon={cilChartPie} height={24} />}
@@ -643,7 +643,7 @@ React Alert is prepared for any length of text, as well as an optional close but
         value="89.9%"/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetF
+      <CWidgetStatsF
         className="mb-3"
         color="warning"
         icon={<CIcon icon={cilChartPie} height={24} />}
@@ -654,7 +654,7 @@ React Alert is prepared for any length of text, as well as an optional close but
   </CRow>
     <CRow>
     <CCol xs={6}>
-      <CWidgetF
+      <CWidgetStatsF
         className="mb-3"
         color="primary"
         footer={
@@ -673,7 +673,7 @@ React Alert is prepared for any length of text, as well as an optional close but
         value="89.9%"/>
     </CCol>
     <CCol xs={6}>
-      <CWidgetF
+      <CWidgetStatsF
         className="mb-3"
         color="warning"
         footer={
@@ -696,26 +696,26 @@ React Alert is prepared for any length of text, as well as an optional close but
 
 ## API
 
-### CWidgetA
+### CWidgetStatsA
 
-<Props of={CWidgetA} />
+<Props of={CWidgetStatsA} />
 
-### CWidgetB
+### CWidgetStatsB
 
-<Props of={CWidgetB} />
+<Props of={CWidgetStatsB} />
 
-### CWidgetC
+### CWidgetStatsC
 
-<Props of={CWidgetC} />
+<Props of={CWidgetStatsC} />
 
-### CWidgetD
+### CWidgetStatsD
 
-<Props of={CWidgetD} />
+<Props of={CWidgetStatsD} />
 
-### CWidgetE
+### CWidgetStatsE
 
-<Props of={CWidgetE} />
+<Props of={CWidgetStatsE} />
 
-### CWidgetF
+### CWidgetStatsF
 
-<Props of={CWidgetF} />
+<Props of={CWidgetStatsF} />

src/components/widgets/CWidgetA.tsx renamed to src/components/widgets/CWidgetStatsA.tsx

@@ -7,7 +7,7 @@ import { Colors, colorPropType } from '../Types'
 import { CCard } from '../card/CCard'
 import { CCardBody } from '../card/CCardBody'
 
-export interface CWidgetAProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+export interface CWidgetStatsAProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
   /**
    * Action node for your component. [docs]
    */
@@ -36,7 +36,7 @@ export interface CWidgetAProps extends Omit<HTMLAttributes<HTMLDivElement>, 'tit
   value?: string | number | ReactNode
 }
 
-export const CWidgetA = forwardRef<HTMLDivElement, CWidgetAProps>(
+export const CWidgetStatsA = forwardRef<HTMLDivElement, CWidgetStatsAProps>(
   ({ action, chart, className, color, title, value, ...rest }, ref) => {
     const _className = classNames(
       { [`bg-${color}`]: color, 'text-high-emphasis-inverse': color },
@@ -58,7 +58,7 @@ export const CWidgetA = forwardRef<HTMLDivElement, CWidgetAProps>(
   },
 )
 
-CWidgetA.propTypes = {
+CWidgetStatsA.propTypes = {
   action: PropTypes.node,
   chart: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
   className: PropTypes.string,
@@ -67,4 +67,4 @@ CWidgetA.propTypes = {
   value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 }
 
-CWidgetA.displayName = 'CWidgetA'
+CWidgetStatsA.displayName = 'CWidgetStatsA'

src/components/widgets/CWidgetB.tsx renamed to src/components/widgets/CWidgetStatsB.tsx

@@ -7,7 +7,7 @@ import { CCard } from '../card/CCard'
 import { CCardBody } from '../card/CCardBody'
 import { CProgress, CProgressProps } from '../progress/CProgress'
 
-export interface CWidgetBProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+export interface CWidgetStatsBProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
   /**
    * A string of all className you want applied to the base component. [docs]
    */
@@ -42,7 +42,7 @@ export interface CWidgetBProps extends Omit<HTMLAttributes<HTMLDivElement>, 'tit
   value?: string | number | ReactNode
 }
 
-export const CWidgetB = forwardRef<HTMLDivElement, CWidgetBProps>(
+export const CWidgetStatsB = forwardRef<HTMLDivElement, CWidgetStatsBProps>(
   ({ className, color, inverse, progress, text, title, value, ...rest }, ref) => {
     return (
       <CCard
@@ -67,7 +67,7 @@ export const CWidgetB = forwardRef<HTMLDivElement, CWidgetBProps>(
   },
 )
 
-CWidgetB.propTypes = {
+CWidgetStatsB.propTypes = {
   className: PropTypes.string,
   color: colorPropType,
   inverse: PropTypes.bool,
@@ -77,4 +77,4 @@ CWidgetB.propTypes = {
   value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 }
 
-CWidgetB.displayName = 'CWidgetCWidgetB'
+CWidgetStatsB.displayName = 'CWidgetCWidgetStatsB'

src/components/widgets/CWidgetC.tsx renamed to src/components/widgets/CWidgetStatsC.tsx

@@ -7,7 +7,7 @@ import { CCard } from '../card/CCard'
 import { CCardBody } from '../card/CCardBody'
 import { CProgress, CProgressProps } from '../progress/CProgress'
 
-export interface CWidgetCProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+export interface CWidgetStatsCProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
   /**
    * A string of all className you want applied to the base component. [docs]
    */
@@ -42,7 +42,7 @@ export interface CWidgetCProps extends Omit<HTMLAttributes<HTMLDivElement>, 'tit
   value?: string | number | ReactNode
 }
 
-export const CWidgetC = forwardRef<HTMLDivElement, CWidgetCProps>(
+export const CWidgetStatsC = forwardRef<HTMLDivElement, CWidgetStatsCProps>(
   ({ className, color, icon, inverse, progress, title, value, ...rest }, ref) => {
     return (
       <CCard
@@ -80,7 +80,7 @@ export const CWidgetC = forwardRef<HTMLDivElement, CWidgetCProps>(
   },
 )
 
-CWidgetC.propTypes = {
+CWidgetStatsC.propTypes = {
   className: PropTypes.string,
   color: colorPropType,
   icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
@@ -90,4 +90,4 @@ CWidgetC.propTypes = {
   value: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.number]),
 }
 
-CWidgetC.displayName = 'CWidgetCWidgetC'
+CWidgetStatsC.displayName = 'CWidgetStatsCWidgetStatsC'

src/components/widgets/CWidgetD.tsx renamed to src/components/widgets/CWidgetStatsD.tsx

@@ -1,4 +1,4 @@
-import React, { forwardRef, HTMLAttributes, ReactNode, useMemo } from 'react'
+import React, { forwardRef, HTMLAttributes, ReactNode } from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 
@@ -14,7 +14,7 @@ type Value = {
   value?: number | string | ReactNode
 }
 
-export interface CWidgetDProps extends HTMLAttributes<HTMLDivElement> {
+export interface CWidgetStatsDProps extends HTMLAttributes<HTMLDivElement> {
   /**
    * A string of all className you want applied to the base component. [docs]
    */
@@ -39,7 +39,7 @@ export interface CWidgetDProps extends HTMLAttributes<HTMLDivElement> {
   values?: Value[]
 }
 
-export const CWidgetD = forwardRef<HTMLDivElement, CWidgetDProps>(
+export const CWidgetStatsD = forwardRef<HTMLDivElement, CWidgetStatsDProps>(
   ({ className, chart, color, icon, values, ...rest }, ref) => {
     const _className = classNames(className)
     const classNameHeader = classNames(
@@ -74,12 +74,12 @@ export const CWidgetD = forwardRef<HTMLDivElement, CWidgetDProps>(
   },
 )
 
-CWidgetD.propTypes = {
+CWidgetStatsD.propTypes = {
   chart: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
   className: PropTypes.string,
   color: colorPropType,
   icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
   values: PropTypes.arrayOf(PropTypes.any),
 }
 
-CWidgetD.displayName = 'CWidgetD'
+CWidgetStatsD.displayName = 'CWidgetStatsD'