Skip to main content

​
CartRelatedItems

A horizontal carousel displayed within or below the cart panel that suggests related or complementary items to encourage upselling.

​
Preview

View in Storybook

​
Import

import { CartRelatedItems } from '@/components/CartRelatedItems'

​
Usage

<CartRelatedItems
  items={suggestedItems}
  onAddItem={handleQuickAdd}
/>

​
Props

​
items
Product[]
required
Array of suggested products to display.
​
onAddItem
(product: Product) => void
required
Callback fired when a suggested item’s add button is clicked.

​
Behavior

  • Shows compact product cards with image, name, price, and quick-add button
  • Horizontally scrollable with peek effect
  • Items are determined by the backend based on cart contents
  • Hidden when no suggestions are available