# reusable-cart-component

> This is a reusable cart component you can install to you react application to display cart items. it includes all functionalities of a cart component: adding or reducing the quantity of an item, removing items from the cart as well as clearing the cart.

Latest version **1.0.42** (published 2023-11-22) · MIT license · 0 weekly downloads

## Install

```sh
npm install reusable-cart-component
pnpm add reusable-cart-component
yarn add reusable-cart-component
bun add reusable-cart-component
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.42 |
| Published | 2023-11-22 |
| First published | 2023-11-10 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=10 |
| Dependencies | 1 |
| Unpacked size | 36.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | kristinenyaga |
| Maintainers | kriskodes |
| Keywords | react, cart, shopping cart, cart component, reusable cart component |

## Links

- npm: https://www.npmjs.com/package/reusable-cart-component
- Repository: https://github.com/kristinenyaga/reusable-cart-component
- Homepage: https://github.com/kristinenyaga/reusable-cart-component#readme
- Issues: https://github.com/kristinenyaga/reusable-cart-component/issues
- npm.io page: https://npm.io/package/reusable-cart-component

## Dependencies (1)

- [axios](https://npm.io/package/axios.md) ^1.6.1

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.42 (latest) — 2023-11-22
- 1.0.41 — 2023-11-22
- 1.0.40 — 2023-11-22
- 1.0.39 — 2023-11-22
- 1.0.37 — 2023-11-22
- 1.0.36 — 2023-11-22
- 1.0.35 — 2023-11-22
- 1.0.34 — 2023-11-22
- 1.0.33 — 2023-11-22
- 1.0.32 — 2023-11-22
- 1.0.31 — 2023-11-22
- 1.0.30 — 2023-11-22
- 1.0.29 — 2023-11-22
- 1.0.28 — 2023-11-22
- 1.0.27 — 2023-11-22
- … 26 more at https://npm.io/package/reusable-cart-component/versions

## README

# Reusable-Cart-Component

> This is a reusable cart component you can install to an e-commerce react application to display cart items. it includes all functionalities of a cart component: 
1. Viewing items added to cart
2. Adding or reducing the quantity of an item
3. Removing an item from the cart
4. Clearing the cart.
5. Displaying the total amount of all items in Ksh
6. Displaying the amount per item based on the quantity

[![NPM](https://img.shields.io/npm/v/reusable-cart-component.svg)](https://www.npmjs.com/package/reusable-cart-component) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## How to Install

```bash
npm install --save reusable-cart-component
```

## Usage
- In the jsx component you want to display the cart items you need to:
1. Install the components in your main folder
2. Ensure the component is visible in your `package.json file`
3. Import the component as shown below
4. Instantiate the component
5. Provide the cart items (the items selected by a user from the main products page)
6. The component will do the rest 🎊

```jsx
import MyComponent from 'reusable-cart-component'
import 'reusable-cart-component/dist/index.css'


const Cart = () => {
  return (
    <div>
      <ReusableCartComponent items={items} cartId={cartId}  />  
    </div>
  )
}

export default Cart
```
## Requirements
```
Node version >=10
```

## License

MIT © 
## Github
[kristinenyaga](https://github.com/kristinenyaga)

## Reach out
- For any queries,suggestions reach out to:
nyagakristine@gmail.com
angieschacha@gmail.com
emutheu1998@gmail.com

---
_Source: https://npm.io/package/reusable-cart-component · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._