XRDProfileListItem

Compact list-view row for restaurant listings. Used as an alternative to XRDProfileCard when the user prefers a denser view (see /restaurants view toggle).

Usage

<XRDProfileListItem
  v-for="restaurant in restaurants"
  :key="restaurant.slug"
  :restaurant="restaurant"
/>

The component is the entire row (it's wrapped in NuxtLink itself) — no outer container needed.

Props

Both the playground mock type (Restaurant, with hours: { monday, tuesday, ... }) and the API response type (RestaurantApiResponse, with openingHours: [{ dayOfWeek, opens, closes }]) are accepted — the Open Now badge picks the right one automatically.

Display

Each row shows:

• Thumbnail (80×80) with a small dot in the bottom-left indicating Open Now (green) / Closed (gray)
• Name + price range
• Cuisine + neighborhood/city
• Distance from user (when geolocation is granted)
• Star rating + review count
• Open Now / Closed label
• Chevron indicating the row is clickable

Notes

• Width-responsive — thumbnail and metadata collapse gracefully on mobile.
• Open Now dot uses the same useOpenNow composable as XRDProfileCard, so behavior is consistent.

AI Context

component: XRDProfileListItem
package: "@xenterprises/nuxt-x-restaurants"
use-when: >
  Displaying restaurants in a dense list view. Pairs with XRDProfileCard
  for the view-mode toggle on /restaurants. Shows essential info (name,
  cuisine, rating, open status, distance) in a single horizontal row.