/* Components for the villa landing page. */
const { useState, useEffect, useMemo, useRef } = React;
// ─────────────────────────────────────────────────────────────
// Map helpers — build links to external map services
// ─────────────────────────────────────────────────────────────
function mapyCzLink([lat, lon], zoom = 15) {
return `https://mapy.cz/zakladni?source=coor&id=${lon}%2C${lat}&z=${zoom}`;
}
function googleMapsLink([lat, lon]) {
return `https://www.google.com/maps/search/?api=1&query=${lat}%2C${lon}`;
}
function googleDirections(from, to, mode = "driving") {
return `https://www.google.com/maps/dir/?api=1&origin=${from[0]}%2C${from[1]}&destination=${to[0]}%2C${to[1]}&travelmode=${mode}`;
}
function mapyCzRoute(from, to, mode = "car_fast") {
return `https://mapy.cz/fnc/v1/route?mapset=outdoor&start=${from[1]},${from[0]}&end=${to[1]},${to[0]}&routeType=${mode}`;
}
// ─────────────────────────────────────────────────────────────
// Icons (monoline, 24x24)
// ─────────────────────────────────────────────────────────────
const icon = (path, vb = "0 0 24 24") => ({ size = 22, color = "currentColor", stroke = 1.5 }) => (
);
const IconWifi = icon(<>);
const IconKey = icon(<>);
const IconCar = icon(<>);
const IconPhone = icon();
const IconMail = icon(<>);
const IconClock = icon(<>);
const IconShield = icon();
const IconStorage = icon(<>);
const IconSun = icon(<>);
const IconMoon = icon();
const IconGrid = icon(<>);
const IconList = icon(<>);
const IconTile = icon(<>);
const IconClose = icon(<>);
const IconArrow = icon(<>);
const IconPinDrop = icon(<>);
const IconNavigate = icon(<>);
const IconCopy = icon(<>);
const IconCheck = icon();
const IconHome = icon(<>);
const IconStar = icon();
// Category icons — elegant, monoline
const IconTrip = icon(<>);
const IconWater = icon(<>);
const IconSport = icon(<>);
const IconWalk = icon(<>);
const IconWellness = icon(<>);
const IconBike = icon(<>);
const IconGastro = icon(<>);
const CATEGORY_META = {
trips: { Icon: IconTrip },
water: { Icon: IconWater },
sport: { Icon: IconSport },
walks: { Icon: IconWalk },
wellness: { Icon: IconWellness },
cycling: { Icon: IconBike },
gastro: { Icon: IconGastro },
};
const DIFFICULTY_DOTS = { easy: 1, medium: 2, hard: 3 };
// ─────────────────────────────────────────────────────────────
// Flags (SVG, no external deps)
// ─────────────────────────────────────────────────────────────
function Flag({ code, size = 18 }) {
const w = size * 1.4, h = size;
const r = 2;
const flags = {
cs: (
),
en: (
),
de: (
),
pl: (
),
};
return (
);
}
// ─────────────────────────────────────────────────────────────
// Language switcher
// ─────────────────────────────────────────────────────────────
function LangSwitcher({ lang, setLang, dark }) {
const codes = ["cs", "en", "de", "pl"];
return (
{codes.map(c => (
))}
);
}
// ─────────────────────────────────────────────────────────────
// Hero background — layered botanical SVG (no photos)
// ─────────────────────────────────────────────────────────────
function HeroBackground({ dark, variant }) {
if (variant === 'minimal') {
return (
);
}
if (variant === 'topo') {
return (
);
}
// Default: botanical — real photo with elegant green/gold overlay
return (
{window.HERO_IMAGE && (
{ e.currentTarget.style.display = 'none'; }}
/>
)}