# useCart
Provides access to the cart object.
### Example code

```jsx
import {CartProvider, useCart} from '@shopify/hydrogen-react';

export function App() {
  <CartProvider
    onLineAdd={() => {
      console.log('a line is being added');
    }}
    onLineAddComplete={() => {
      console.log('a line has been added');
    }}
  >
    <CartComponent />
  </CartProvider>;
}

function CartComponent() {
  const {linesAdd, status} = useCart();

  const merchandise = {merchandiseId: '{id-here}'};

  return (
    <div>
      Cart Status: {status}
      <button onClick={() => linesAdd([merchandise])}>Add Line</button>
    </div>
  );
}

```

```tsx
import {CartProvider, useCart} from '@shopify/hydrogen-react';
import type {CartLineInput} from '@shopify/hydrogen-react/storefront-api-types';

export function App() {
  <CartProvider
    onLineAdd={() => {
      console.log('a line is being added');
    }}
    onLineAddComplete={() => {
      console.log('a line has been added');
    }}
  >
    <CartComponent />
  </CartProvider>;
}

function CartComponent() {
  const {linesAdd, status} = useCart();

  const merchandise: CartLineInput = {merchandiseId: '{id-here}'};

  return (
    <div>
      Cart Status: {status}
      <button onClick={() => linesAdd([merchandise])}>Add Line</button>
    </div>
  );
}

```


## Props
`useCart` hook must be a descendent of a `CartProvider` component.
### UseCartDocs

#### Returns: CartWithActionsDocs

type UseCartDocs = () => CartWithActionsDocs;
### CartWithActionsDocs

### attributes
The cart's attributes.
### buyerIdentity
The cart's buyer identity.
### buyerIdentityUpdate
A callback that updates the buyer identity in the cart. Expects the same `buyerIdentity` input that you would provide to the Storefront API's `cartBuyerIdentityUpdate` mutation.
### cartAttributesUpdate
A callback that updates the cart attributes. Expects the same `attributes` input that you would provide to the Storefront API's `cartAttributesUpdate` mutation.
### cartCreate
A callback that creates a cart. Expects the same input you would provide to the Storefront API's `cartCreate` mutation.
### cartFragment
The fragment used to query the cart object for all queries and mutations.
### cartReady
A boolean indicating if the cart is ready to be interacted with.
### checkoutUrl
The checkout URL for the cart, if the cart has been created in the Storefront API.
### cost
The cost for the cart, including the subtotal, total, taxes, and duties.
### discountCodes
The discount codes applied to the cart.
### discountCodesUpdate
A callback that updates the cart's discount codes. Expects the same `codes` input that you would provide to the Storefront API's `cartDiscountCodesUpdate` mutation.
### error
If an error occurred on the previous cart action, then `error` will exist and `cart` will be put back into the last valid status it was in.
### id
The cart's ID if it has been created through the Storefront API.
### lines
The cart lines.
### linesAdd
A callback that adds lines to the cart. Expects the same `lines` input that you would provide to the Storefront API's `cartLinesAdd` mutation. If a cart doesn't already exist, then it will create the cart for you.
### linesRemove
A callback that removes lines from the cart. Expects the same `lines` input that you would provide to the Storefront API's `cartLinesRemove` mutation. Only lines that are included in the `lines` parameter will be in the cart afterwards.
### linesUpdate
A callback that updates lines in the cart. Expects the same `lines` input that you would provide to the Storefront API's `cartLinesUpdate` mutation. If a line item is not included in the `lines` parameter, it will still exist in the cart and will not be changed.
### note
The cart's note.
### noteUpdate
A callback that updates the note in the cart. Expects the same `note` input that you would provide to the Storefront API's `cartNoteUpdate` mutation.
### status
The status of the cart. This returns `uninitialized` when the cart is not yet created, `creating` when the cart is being created, `fetching` when an existing cart is being fetched, `updating` when the cart is updating, and `idle` when the cart isn't being created or updated.
### totalQuantity
The total number of items in the cart, across all lines. If there are no lines, then the value is 0.
### CartStatus

CartState['status']
### CartState

{status: 'uninitialized'; error?: string} | {status: 'fetching'} | {status: 'creating'} | {status: 'updating'; cart: Cart; lastValidCart: Cart} | {status: 'idle'; cart: Cart; error?: string}
### Cart

PartialDeep<CartBase, {recurseIntoArrays: true}>
## Related
- [CartProvider](/api/hydrogen-react/components/CartProvider)