Skip to main content

​
ProductDescriptionScreen

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 full-screen overlay that shows detailed product information including image, description, modifier groups, quantity selector, and an add-to-cart button with running total.

​
Preview

​
Import

​
Usage

​
Props

​
Product
required
The product to display, including all modifier groups.
​
(item: CartItem) => void
required
Callback fired when the user confirms selections and adds the item to cart.
​
() => void
required
Callback to dismiss the screen.

​
Behavior

  • Displays product hero image with parallax scroll effect
  • Renders all modifier groups using ModifierGroup components
  • Shows running price total that updates as modifiers are selected
  • Validates required modifier groups before enabling the add button
  • Supports special instructions text input at the bottom