DashboardStats Component

The DashboardStats component is a React component for displaying dashboard statistics in a visually appealing way.

Author

• @author Narayanamoorthi [email protected]

Link

Story Book Link DialogBox

PlayGround

Try it have a fun codeBox

Installation

npm install @licuido-ui/ui_dashboard-stats

Import component

import { DashboardStats } from '@licuido-ui/ui_dashboard-stats';

Usage

<DialogBox dashBoardData={dashboardData} />

Image

Sample Code

 <DashboardStats
  name={'Employee count'}
  count={'245'}
  IconbgColor={'#e7f4f8'}
  Icon={<EmployeeIcon />} />
/>

Props

| Prop | Type | Description | | --------------- | ------------------------------ | ---------------------------------------------------------------------------------------------------- | | className | string | Additional class name for styling. | | sx | SxProps | Custom styling using Material-UI's SxProps. | | dashBoardData | DashBoardData[] | Array of DashBoardData items to be displayed on the dashboard. | | count | React.ReactNode,string, number | I can add a any thing in count props because they have a dataTypes of number , string and react node | | nameStyle | SxProps | Styling for the name of the data item. | | cardStyle | SxProps | Styling for the individual dashboard card. | | countStyle | SxProps | Styling for the count associated with the data item. |