Skip to main content

​
CartNavButton

Need an API key?

Get one from Crave Dashboard > Developers > API Development > Step 1 - API Keys. Copy the matching locationId from Step 2 - Location IDs on the same page.
A button that displays the current cart item count as a badge and optionally shows the cart total. Typically placed in the header or as a floating action button on mobile.

​
Preview

​
Import

​
Usage

​
Props

​
number
required
Number of items currently in the cart.
​
number
Cart total to display alongside the button text.
​
() => void
required
Callback fired when the button is clicked — typically opens the CartPanel.

​
Behavior

  • Badge animates with a bounce effect when item count changes
  • Hides when cart is empty (itemCount === 0)
  • On mobile, renders as a fixed-position floating button at the bottom
  • On desktop, renders inline in the header navigation