import { PropertyListingCard } from "zostel-ui";

<PropertyListingCard
  name="Zostel Goa"
  location="Goa"
  imageUrl="/brand/scenes/waters.svg"
  pricePerNight={2345}
  rating={4.4}
  amenities={["Wi-Fi", "Café", "Beach"]}
  href="/stays/goa"
/>

Props

Prop	Type	Default	Description
`name`	`string`	—	The stay.
`location`	`string`	—	Place and state.
`imageUrl`	`string`	—	A cover: a photo of the stay, or its landscape (/brand/scenes/<family>.svg). Never stock photos.
`pricePerNight`	`number`	—	“From” price.
`currency`	`string`	`"INR"`	ISO 4217 code: INR (₹1,23,456), NPR, THB (฿12,345)… Printed with formatPrice.
`rating`	`number`	—	Out of 5, on the picture.
`amenities`	`string[]`	`[]`	The first four show, then “+n”.
`href`	`string`	—	Makes the card a link.
`className`	`string`	—	More classes, merged with the component’s own (tailwind-merge).

name

Type: string

Default: —

The stay.

location

Type: string

Default: —

Place and state.

imageUrl

Type: string

Default: —

A cover: a photo of the stay, or its landscape (/brand/scenes/<family>.svg). Never stock photos.

pricePerNight

Type: number

Default: —

“From” price.

currency

Type: string

Default: "INR"

ISO 4217 code: INR (₹1,23,456), NPR, THB (฿12,345)… Printed with formatPrice.

rating

Type: number

Default: —

Out of 5, on the picture.

amenities

Type: string[]

Default: []

The first four show, then “+n”.

href

Type: string

Default: —

Makes the card a link.

className

Type: string

Default: —

More classes, merged with the component’s own (tailwind-merge).

Samples

The amounts, ratings and reviews in these demos are samples, not offers — the places are real (every Zostel place, from /brand/places/index.json).