Skip to main content

​
Item

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 versatile product card component that displays a menu item with image, name, description, price, and a quick-add button. Supports both vertical (grid) and horizontal (list) layouts.

​
Preview

​
Import

​
Usage

​
Props

​
Product
required
The product object containing name, description, price, images, and modifier groups.
​
'vertical' | 'horizontal'
default:"vertical"
Controls the card layout direction.
​
(product: Product) => void
required
Callback fired when the add button is clicked. If the product has modifiers, this should open the ProductDescriptionScreen.

​
Behavior

  • Truncates long descriptions with ellipsis
  • Shows product image with fallback placeholder
  • Quick-add button bypasses modifier screen when no modifiers exist
  • Displays “From $X.XX” when modifier groups affect pricing