Stays Review Card

Review Card

What one traveller said: their Zobu or initials, the stars, the words.

Preview

Aditi, Pune

Sample

Came alone, left with six friends and a plan for Kasol. The common room never sleeps.

Kabir, Delhi

Sample

Walked to Hadimba before breakfast. Clean dorm, hot water, good chai.

Sample reviews — the words of no real guest.

Usage

tsx

import { ReviewCard } from "zostel-ui";

<ReviewCard
  author="Aditi, Pune"
  avatarUrl="/brand/zobu/pfp-02.png"
  rating={5}
  date="October"
  content="Came alone, left with six friends."
/>

Props

Prop	Type	Default	Description
`author`	`string`	—	Name as they want it shown; initials come from it.
`avatarUrl`	`string`	—	A photo, or a Zobu (/brand/zobu/pfp-01.png…).
`rating`	`number`	—	Out of 5; halves show.
`date`	`string`	—	When.
`content`	`string`	—	The review.
`className`	`string`	—	More classes, merged with the component’s own (tailwind-merge).

author

Type: string

Default: —

Name as they want it shown; initials come from it.

avatarUrl

Type: string

Default: —

A photo, or a Zobu (/brand/zobu/pfp-01.png…).

rating

Type: number

Default: —

Out of 5; halves show.

date

Type: string

Default: —

When.

content

Type: string

Default: —

The review.

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).