// Villa Mesochori — home page, content harvested from the owners' Airbnb & Booking.com listings const NS = window.VillaMesochoriDesignSystem_9e1a21; const { Button, Badge, Card, LucideIcon } = NS; // Photos now come from the content store (owners can replace them in the admin area). // Amenities now come from the content store (editable in the owners' area). // "More photos" — collapsed gallery that expands on click function MorePhotos({ items }) { const [open, setOpen] = React.useState(false); const shown = items.filter((g) => g.label || g.img); if (!shown.length) return null; return (
More photos

A closer look inside

{open && (
{shown.map((g, i) => (
{g.img ? ( ) : (
Photo coming soon
)}
{g.label}
))}
)}
); } function Eyebrow({ color = "var(--accent)", children }) { return {children}; } function Photo({ src, alt, style, className }) { return {alt}; } // Split "a | b | c" multiline content strings into arrays function vmLines(str, parts) { return String(str || "").split("\n").map((l) => l.trim()).filter(Boolean).map((l) => { const bits = l.split("|").map((b) => b.trim()); while (bits.length < parts) bits.push(""); return bits; }); } function Home({ onBook, onGuide, onManual }) { const c = window.VMContent.get(); const highlights = vmLines(c.homeHighlights, 3); const amenities = vmLines(c.amenities, 2); return (
{/* Hero */}

{c.heroTitle}

{c.heroSub}

{/* Highlights */}
{highlights.map(([icon, title, body]) => (

{title}

{body}

))}
{/* The house */}
The house

{c.houseTitle}

{c.houseBody1}

{c.houseBody2}

Sleeps {c.maxGuests} From {c.currency}{c.nightly} / night Books direct
{/* House detail cards */} {(c.houseCards || []).length > 0 && (
{c.houseCards.map((card, i) => (

{card.title}

{card.body}

))}
)} {/* Where you'll sleep */}
Where you'll sleep

{c.bedsTitle}

{[ [c.imgBedDouble, c.bedDoubleTitle, c.bedDoubleBody], [c.imgBedTwin, c.bedTwinTitle, c.bedTwinBody], ].map(([src, title, body]) => (

{title}

{body}

))}
{/* More photos */} {/* The view */}
The view

{c.viewTitle}

{c.viewBody}

{c.hostNote}

{/* Amenities */}
What the house offers

{c.amenTitle}

{amenities.map(([icon, label]) => (
{label}
))}
{/* The village */}
The village

{c.villageTitle}

{c.villageBody1}

{c.villageBody2}

{/* Guide + manual teasers */}
Open the guide} onClick={onGuide}> Simos beach, Monemvasia, the tavernas we actually eat at — everything we tell friends when they visit. Read the manual} onClick={onManual}> Check-in from {c.checkIn}, checkout by {c.checkOut}, where to park, and the few house rules we ask everyone to keep.
{/* CTA band */}

{c.ctaTitle}

{c.ctaBody}

); } window.VMHome = Home;