# UiForge

# AutoCounter Component

A reusable React component for managing and displaying quantity counters on websites. It supports incrementing, decrementing, and customizable styles like font size and color. This component is ideal for use cases like shopping carts, counters, or any UI where a numeric value needs to be displayed and animated.

## Installation

To install the `uiforge` component, you can use npm:

```bash
npm install uiforge

Or with Yarn:

yarn add autocounter

```

## Usage

import { AutoCounter } from 'autocounter';

function App() {
return (

<div>
<h1>Auto Counter Example</h1>
<AutoCounter quantity={100} delay={20} size="24" color="blue" />
</div>
);
}

export default App;

## Example

<AutoCounter 
  quantity={1000} 
  delay={50} 
  size="30" 
  color="green" 
/>

## Props

- **`quantity`** (`number`):  
  The target quantity (a positive integer). This is the number the counter will increment towards.  
  **Required**

- **`delay`** (`number`):  
  The delay in milliseconds between each increment. The default is 10ms.  
  **Default Value**: `10`

- **`size`** (`string | number`):  
  The font size of the displayed number. You can pass a string (e.g., `"18px"`) or a number (e.g., `18`).  
  **Default Value**: `"18"`

- **`color`** (`string`):  
  The color of the counter text. You can use any valid CSS color value.  
  **Default Value**: `"black"`

## Contributing

If you would like to contribute to this project, please feel free to fork the repository and submit a pull request. All contributions are welcome!

## License

This project is licensed under the ISC License - see the LICENSE file for details.

## Bugs and Issues

If you encounter any issues or bugs, please file an issue on the GitHub repository:

https://github.com/lokeshkumar-2003/UiForge/issues

## Authors

Lokesh Kumar - Initial work - lokeshkumar-2003
Balaji - Contributor - balaji