setMenu(null)} style={{ position: 'fixed', inset: 0 }}/>}
{menu === 'lang' && (
{LANGS.map(([L, flag, name]) => (
))}
)}
{menu === 'nav' && (
{navItems.map(item => (
))}
)}
);
}
// ─── TITLE + PHOTO GRID ─────────────────────────────────────────────────
function TitleA({ lang, rv }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const b = V_ALPINE.brand;
return (
{t('hero_title_a')} {t('hero_title_b')}
{rv.count > 0 && (
)}
);
}
function PhotoGridA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const open = useContext(LightboxCtx);
const [playing, setPlaying] = useState(false);
const g = V_ALPINE.photos.gallery;
return (
{playing ? (
) : (
)}
{g.slice(0, 4).map((p, i) => (
))}
{g.length > 0 && (
)}
);
}
// ─── LEFT COLUMN: about the gîte ────────────────────────────────────────
function OverviewA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const b = V_ALPINE.brand, c = V_ALPINE.contact;
const amen = (key) => trA(V_ALPINE.amenities.find(a => a.key === key), lang);
const highlights = [
[IconA.ski, `${b.distToLift} m ${t('stat_lift')}`],
[IconA.garage, amen('garage')],
[IconA.terrace, amen('terrace')],
];
return (
<>
{t('intro_title')}
{b.capacity} {t('stat_guests')}, {b.bedrooms} {t('stat_rooms')}, {b.bathrooms} {t('stat_baths')}, {b.surface} m²
{t('own_host')}: {c.name}
{t('own_since')} 2022
{highlights.map(([icon, text], i) => (
{icon}
{text}
))}
{t('hero_lede')}
{t('intro_body')}
);
}
function FloorsA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const [zoom, setZoom] = useState(null);
const plans = [
{ src: 'images/plan-rdc.jpg', label: t('floor_gf'),
note: lang === 'fr' ? 'Sur 2 niveaux : salon, cuisine, 3 chambres (1, 2 et 3), 2 terrasses, parking 2 places'
: lang === 'nl' ? 'Over 2 niveaus: salon, keuken, 3 slaapkamers (1, 2 en 3), 2 terrassen, parking 2 plekken'
: 'Across 2 levels: living, kitchen, 3 bedrooms (1, 2 and 3), 2 terraces, parking for 2' },
{ src: 'images/plan-etage.jpg', label: t('floor_1'),
note: lang === 'fr' ? 'Chambre 4 (2 lits 80×200), salle d’eau privée (SDB 4)'
: lang === 'nl' ? 'Slaapkamer 4 (2 bedden 80×200), privé-badkamer (SDB 4)'
: 'Bedroom 4 (2 single beds 80×200), private bathroom (SDB 4)' },
];
const floors = [['floor_1', 'floor_1_desc'], ['floor_gf', 'floor_gf_desc'], ['floor_bs', 'floor_bs_desc'], ['floor_base', 'floor_base_desc']];
return (
{t('floors_title')}
{plans.map((p, i) => (
))}
{floors.map(([label, desc]) => (
))}
{zoom && (
setZoom(null)} style={{ position: 'fixed', inset: 0, zIndex: 200, background: 'rgba(31,44,30,0.94)',
display: 'flex', flexDirection: 'column', alignItems: 'center',
justifyContent: 'center', padding: 24, cursor: 'zoom-out' }}>
{zoom.label}
{lang === 'fr' ? 'Cliquer pour fermer' : lang === 'nl' ? 'Klik om te sluiten' : 'Click to close'}
)}
);
}
function AmenitiesA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
return (
{t('amen_title')}
{V_ALPINE.amenities.map((a, i) => (
{IconA[a.key]}
{trA(a, lang)}
))}
);
}
// ─── LIVE DATA: Gîtes de France (ITEA widgets) ─────────────────────────
// The widget endpoint returns its HTML as JSONP (CORS allowed). We parse that HTML
// and render the data in the page's own style instead of the widget's look.
// Language follows Accept-Language; the documented `langue` param is ignored by the server.
const ITEA_URL = (widget) =>
`https://widget.itea.fr/widget.php?key=tftr8_fc&numGite=${V_ALPINE.brand.ref}&widget=${widget}&callback=cb`;
const ITEA_HOST = { fr: 'widget', en: 'widget-uk', nl: 'widget-nl' }; // booking pages open in this language
const iteaCache = {};
function useItea(widget, lang) {
const [doc, setDoc] = useState(null); // null = loading, false = failed
useEffect(() => {
let alive = true;
const k = widget + lang;
iteaCache[k] = iteaCache[k] || fetch(ITEA_URL(widget), { headers: { 'Accept-Language': lang } })
.then(r => r.text())
.then(s => new DOMParser().parseFromString(
JSON.parse(s.slice(s.indexOf('(') + 1, s.lastIndexOf(')'))).html, 'text/html'));
iteaCache[k].then(d => alive && setDoc(d), () => alive && setDoc(false));
return () => { alive = false; };
}, [widget, lang]);
return doc;
}
const unshout = (s) => s === s.toUpperCase() ? s.toLowerCase().replace(/(^|[\s'-])\p{L}/gu, c => c.toUpperCase()) : s;
const iteaText = (el, sel) => (el.querySelector(sel)?.textContent || '').replace(/\s+/g, ' ').trim();
const fmtDay = (y, m, d, add, lang) =>
new Date(y, m - 1, +d + add).toLocaleDateString(LOCALE[lang], { day: 'numeric', month: 'short' });
// Weekly prices per season. Live from Gîtes de France: only free weeks carry a price, grouped per price level
// with the months it applies to. Season names come from V_ALPINE.rates (matched on price), which is also the
// fallback while loading or offline.
function useRates(lang) {
const doc = useItea('prix', lang);
const live = {};
if (doc) doc.querySelectorAll('table[data-duree-tarif="semaine"] td.libre').forEach(td => {
const price = parseFloat(td.dataset.prix.replace(',', '.'));
(live[price] = live[price] || new Set()).add(+td.dataset.deb.split('/')[1]);
});
return Object.keys(live).length
? Object.keys(live).map(Number).sort((a, b) => a - b).map(price => {
const known = V_ALPINE.rates.find(r => r.price === price);
const months = [...live[price]].sort((a, b) => a - b)
.map(m => new Date(2000, m - 1).toLocaleDateString(LOCALE[lang], { month: 'short' })).join(', ');
return known ? { season: trA(known.season, lang), months, price } : { season: months, months: '', price };
})
: V_ALPINE.rates.map(r => ({ season: trA(r.season, lang), months: trA(r.months, lang), price: r.price }));
}
// Guest reviews collected by Gîtes de France
function useReviews(lang) {
const doc = useItea('avis', lang);
const reviews = doc ? [...doc.querySelectorAll('.div_widget_itea_avis_detailAvisClient')].map(el => {
const title = iteaText(el, '.p_widget_itea_avis_titreAvis');
return {
// No all-caps text on the site: sentence-case shouted titles, title-case shouted names
title: title === title.toUpperCase() ? title.charAt(0) + title.slice(1).toLowerCase() : title,
name: unshout(iteaText(el, '.p_widget_itea_avis_pseudoClient')),
type: iteaText(el, '.p_widget_itea_avis_typeSejourAvis'),
date: (iteaText(el, '.dateDepotAvis').match(/\d{2}\/\d{2}\/\d{4}/) || [''])[0],
body: iteaText(el, '.p_widget_itea_avis_descriptionAvis'),
stars: el.querySelectorAll('.p_widget_itea_avis_noteGlobale .active').length,
notes: [...el.querySelectorAll('.div_widget_itea_avis_note')]
.map(n => [iteaText(n, '.sp_widget_itea_avis_libelleQuest'), n.querySelectorAll('.active').length]),
};
}) : [];
const avg = reviews.length ? reviews.reduce((a, r) => a + r.stars, 0) / reviews.length : 0;
const title = trA(V_ALPINE.i18n.rev_title, lang).replace('{avg}', fmtOne(avg, lang)).replace('{n}', reviews.length);
return { reviews, avg, title, count: reviews.length };
}
// Availability + the chosen stay, shared by the calendar and the booking card.
// Any stay of free nights can be booked: Saturday → Saturday in a free week is confirmed instantly,
// other dates go to the owner as a request (tested on the Gîtes de France booking page).
function useBooking(lang) {
const doc = useItea('dispo', lang);
const [sel, setSel] = useState({ from: null, to: null }); // arrival / departure, yyyy-mm-dd
const [hover, setHover] = useState(null);
// Arrival days bookable online ("A" days) → Gîtes de France booking page, keyed by yyyy-mm-dd
const links = {};
if (doc) doc.querySelectorAll('a > span.canlendrier_classe_by_lettre_A').forEach(sp => {
links[sp.dataset.date] = `https://${ITEA_HOST[lang]}.itea.fr${sp.parentNode.getAttribute('href')}`;
});
// 18 months, Monday-first weeks
const months = doc ? [...doc.querySelectorAll('li.calendItea_li[data-mois]')].map(li => ({
label: iteaText(li, 'caption'),
heads: [...li.querySelectorAll('thead th')].map(th => th.textContent.trim()),
days: [...li.querySelectorAll('tbody td > span, tbody td > a > span')].map(sp => ({
day: +sp.textContent, date: sp.dataset.date, pad: sp.style.display === 'none',
past: sp.classList.contains('spanCalendJour_avantDatePossible'),
booked: sp.classList.contains('spanCalendJour_occupe'),
})),
})) : [];
const info = {};
months.forEach(m => m.days.forEach(d => { if (!d.pad) info[d.date] = d; }));
const isFree = (iso) => info[iso] && !info[iso].past && !info[iso].booked;
const addDays = (iso, n) => { const [y, m, d] = iso.split('-').map(Number); return new Date(Date.UTC(y, m - 1, d + n)).toISOString().slice(0, 10); };
const nightsFree = (a, b) => { for (let x = a; x < b; x = addDays(x, 1)) if (!isFree(x)) return false; return true; };
const validEnd = (iso) => sel.from && !sel.to && iso > sel.from && nightsFree(sel.from, iso);
const pick = (iso) => {
if (validEnd(iso)) setSel({ from: sel.from, to: iso });
else if (isFree(iso)) setSel({ from: iso, to: null });
};
const nights = sel.to ? Math.round((Date.parse(sel.to) - Date.parse(sel.from)) / 864e5) : 0;
const instant = nights > 0 && nights % 7 === 0 && !!links[sel.from];
const resaBase = doc && doc.querySelector('a[href*="etape1"]')?.getAttribute('href').replace(/&jour=.*$/, '');
const bookUrl = () => {
const [y, m, d] = sel.from.split('-');
return `https://${ITEA_HOST[lang]}.itea.fr${resaBase}&jour=${+d}&mois=${+m}&annee=${y}&duree=${nights}`;
};
const label = (iso, add = 0) => { const [y, m, d] = iso.split('-'); return fmtDay(y, m, d, add, lang); };
return {
doc, links, months, sel, setSel, hover, setHover, isFree, validEnd, pick, nights, instant, bookUrl, label,
end: sel.to || (hover && validEnd(hover) ? hover : null),
next: Object.keys(links).sort()[0],
};
}
// ─── LEFT COLUMN: calendar, rates, why Gîtes de France ─────────────────
function CalendarA({ lang, bk }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const [offset, setOffset] = useState(0);
const per = useMobile() ? 1 : 2; // months in view
const { months, sel, setSel, setHover, isFree, validEnd, end, pick, nights, instant, label, doc } = bk;
const shown = months.slice(offset, offset + per);
const nightsText = `${nights} ${t(nights === 1 ? 'book_night' : 'book_nights')}, ${t(instant ? 'book_instant' : 'book_on_request')}`;
return (
{sel.to ? `${label(sel.from)} → ${label(sel.to)}` : sel.from ? `${label(sel.from)} → …` : t('book_how_title')}
{sel.to ? nightsText : t(sel.from ? 'book_pick_departure' : 'book_how')}
setHover(null)}>
{months.length > per && (
<>
)}
{shown.map(mo => (
{mo.label}
{mo.heads.map((d, i) => (
{d}
))}
{mo.days.map((d, i) => {
if (d.pad) return
;
const edge = d.date === sel.from || (end && d.date === end);
const hoverEnd = !sel.to && end && d.date === end; // previewing a departure day
const inRange = sel.from && end && d.date > sel.from && d.date < end;
const clickable = isFree(d.date) || validEnd(d.date);
const style = {
background: edge && !hoverEnd ? 'var(--ink)' : inRange ? 'var(--soft)' : 'transparent',
color: edge && !hoverEnd ? 'var(--bg)' : d.booked ? 'var(--muted)' : 'var(--ink)',
borderColor: hoverEnd ? 'var(--ink)' : undefined,
borderRadius: edge ? '50%' : inRange ? 0 : undefined,
textDecoration: d.booked ? 'line-through' : 'none',
opacity: d.past ? 0.3 : d.booked ? 0.55 : 1,
};
return clickable
?
:
{d.day}
;
})}
))}
{t('book_free')}
12{t('rates_booked')}
{t('book_yours')}
{sel.from && (
)}
);
}
function BookingCardA({ lang, bk, price }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const c = V_ALPINE.contact;
const { sel, nights, instant, bookUrl, label, links, next } = bk;
const dateBox = (k, iso) => (
);
return (
{t('hero_from')}
{fmtEur(price, lang)}
{t('hero_per_week')}
{dateBox('book_arrival', sel.from)}
{dateBox('book_departure', sel.to)}
{sel.to
?
{t('book_go')}
:
}
{sel.to
? `${nights} ${t(nights === 1 ? 'book_night' : 'book_nights')}, ${t(instant ? 'book_instant' : 'book_on_request')}`
: next &&
{t('book_next')}: {label(next)} → {label(next, 7)}
}
{t('book_help')}
{lang === 'fr' ? 'Paiements : carte bancaire, chèques-vacances ANCV, cartes cadeaux.'
: lang === 'nl' ? 'Betalen: creditcard, ANCV vouchers, cadeaubonnen.'
: 'Payment: credit card, ANCV vouchers, gift cards.'}
);
}
function RatesA({ lang, rows }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
return (
{t('rates_title')}
{t('rates_note')}
{rows.map((r, i) => (
{r.season}
{r.months &&
{r.months}
}
{fmtEur(r.price, lang)}
))}
);
}
function WhyA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
return (
{t('book_why_title')}
{t('book_why_intro')}
{V_ALPINE.i18n.book_why.map(({ title, text }, i) => (
{i + 1}
{trA(title, lang)}
{trA(text, lang)}
))}
);
}
// ─── REVIEWS ────────────────────────────────────────────────────────────
function ReviewsA({ lang, rv }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const [all, setAll] = useState(false);
if (!rv.count) return null; // loading, unreachable, or no reviews yet
// Average score per question across all reviews
const byLabel = {};
rv.reviews.forEach(r => r.notes.forEach(([l, v]) => (byLabel[l] = byLabel[l] || []).push(v)));
const scores = Object.entries(byLabel).map(([l, vs]) => ({ l, v: vs.reduce((a, b) => a + b, 0) / vs.length }));
const shown = all ? rv.reviews : rv.reviews.slice(0, 6);
return (
{Ico.star}{rv.title}
✓{t('rev_verified')}
{scores.length > 0 && (
{scores.map((s, i) => (
{s.l}
{fmtOne(s.v, lang)}
))}
{shown.map(r => )}
{rv.count > 6 && !all && (
)}
);
}
function ReviewCardA({ r, lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const [original, setOriginal] = useState(false);
// Translations are added by the owners in Pages CMS (content/reviews.json), matched on name + date
const tr = V_ALPINE.reviews.find(x => x.name === r.name && x.date === r.date);
const hasTr = !!tr?.body?.[lang];
const showTr = hasTr && !original;
return (
{'★'.repeat(r.stars)}{'★'.repeat(5 - r.stars)}
{r.date}
{showTr ? tr.title[lang] || r.title : r.title}
{showTr ? tr.body[lang] : r.body}
{hasTr && (
{showTr && {t('rev_translated')}}
)}
);
}
// ─── LOCATION ───────────────────────────────────────────────────────────
function LocationA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const b = V_ALPINE.brand;
const fmt = (m) => m >= 1000 ? `${(m / 1000).toFixed(1).replace('.0', '')} km` : `${m} m`;
const onSite = lang === 'fr' ? 'sur place' : lang === 'nl' ? 'ter plaatse' : 'on site';
const [dropdown, setDropdown] = useState(false);
const dropdownRef = useRef(null);
// Close the directions menu on outside click or Esc
useEffect(() => {
if (!dropdown) return;
const onDown = (e) => { if (dropdownRef.current && !dropdownRef.current.contains(e.target)) setDropdown(false); };
const onKey = (e) => { if (e.key === 'Escape') setDropdown(false); };
document.addEventListener('mousedown', onDown);
document.addEventListener('keydown', onKey);
return () => { document.removeEventListener('mousedown', onDown); document.removeEventListener('keydown', onKey); };
}, [dropdown]);
const lat = b.lat, lng = b.lng;
const mapApps = [
{ key: 'osm', label: 'OpenStreetMap',
sub: lang === 'fr' ? 'Dans le navigateur' : lang === 'nl' ? 'In de browser' : 'In your browser',
url: `https://www.openstreetmap.org/?mlat=${lat}&mlon=${lng}#map=16/${lat}/${lng}` },
{ key: 'google', label: 'Google Maps',
sub: lang === 'fr' ? 'Itinéraire, tous appareils' : lang === 'nl' ? 'Route, alle apparaten' : 'Directions, any device',
url: `https://www.google.com/maps/search/?api=1&query=${lat}%2C${lng}` },
{ key: 'apple', label: 'Apple Plans', sub: 'iPhone, iPad, Mac',
url: `https://maps.apple.com/?ll=${lat},${lng}&q=${encodeURIComponent(`${b.name}, ${b.town}`)}` },
{ key: 'waze', label: 'Waze',
sub: lang === 'fr' ? 'Navigation auto' : lang === 'nl' ? 'Auto-navigatie' : 'Driving navigation',
url: `https://www.waze.com/ul?ll=${lat}%2C${lng}&navigate=yes` },
];
const mapEl = useRef(null);
const mapInst = useRef(null);
useEffect(() => {
if (!mapEl.current || mapInst.current || typeof L === 'undefined') return;
const map = L.map(mapEl.current, { zoomControl: false, scrollWheelZoom: false, dragging: !L.Browser.mobile }).setView([lat, lng], 15);
L.control.zoom({ position: 'bottomright' }).addTo(map);
mapInst.current = map;
// OpenStreetMap tiles: no API key needed; attribution is mandatory
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19, attribution: '©
OpenStreetMap',
}).addTo(map);
const houseIcon = L.divIcon({
className: 'vm-house-marker',
html: `
`,
iconSize: [0, 0], iconAnchor: [0, 0],
});
L.marker([lat, lng], { icon: houseIcon, keyboard: false }).addTo(map);
return () => { map.remove(); mapInst.current = null; };
}, [lat, lng]);
return (
{t('loc_title')}
{b.name}, {b.postalCode} {b.town}, {b.region}, {b.country}
{dropdown && (
)}
{lang === 'fr' ? 'Loisirs & commodités' : lang === 'nl' ? 'Voorzieningen in de buurt' : 'Leisure & amenities'}
{lang === 'fr' ? 'Distances à vol d\'oiseau' : lang === 'nl' ? 'Hemelsbreed' : 'As the crow flies'}
{V_ALPINE.distances.map((d, i) => (
{trA(d, lang)}
{d.m === 0 ? onSite : fmt(d.m)}
))}
);
}
// ─── SKI AREA ───────────────────────────────────────────────────────────
function SkiAreaA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const stats = [
{ n: '165', l: { fr: 'km de pistes', en: 'km of slopes', nl: 'km piste' } },
{ n: '2 832', l: { fr: 'm au Cheval Noir', en: 'm at Cheval Noir', nl: 'm Cheval Noir' } },
{ n: '57', l: { fr: 'remontées', en: 'lifts', nl: 'liften' } },
];
return (
{t('ski_title')}
{t('ski_body')}
{stats.map((s, i) => (
))}
);
}
// ─── THINGS TO DO ───────────────────────────────────────────────────────
function ThingsA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const [season, setSeason] = useState('winter');
const name = { winter: { fr: 'Hiver', en: 'Winter', nl: 'Winter' }, summer: { fr: 'Été', en: 'Summer', nl: 'Zomer' } };
return (
{t('todo_title')}
{['winter', 'summer'].map(s => (
))}
{V_ALPINE.todo[season].map((item, i) => (
{i + 1}
{trA(item, lang)}
))}
);
}
// ─── HOST ───────────────────────────────────────────────────────────────
function HostA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const c = V_ALPINE.contact;
const row = (label, value, first) => (
);
return (
{t('own_title')}
{row(t('own_since'), '2022', true)}
{row(t('own_languages'), 'Français, English, Nederlands')}
{t('own_body')}
{row(t('own_phone'), c.phone, true)}
{row(t('own_email'), c.email)}
);
}
// ─── FAQ ────────────────────────────────────────────────────────────────
function FaqA({ lang }) {
const t = (k) => trA(V_ALPINE.i18n[k], lang);
const [open, setOpen] = useState(0);
return (
{t('faq_title')}
{V_ALPINE.faq.map((f, i) => {
const isOpen = open === i;
return (
{isOpen &&
{trA(f.a, lang)}
}
);
})}
);
}
// ─── FOOTER ─────────────────────────────────────────────────────────────
function FooterA() {
const c = V_ALPINE.contact;
const head = { font: '600 14px/1.3 "Manrope", sans-serif', color: '#d4a574', marginBottom: 12 };
return (
);
}
// ─── LIGHTBOX ───────────────────────────────────────────────────────────
function LightboxA({ index, lang, onClose, onPrev, onNext, onJump }) {
useEffect(() => {
const onKey = (e) => {
if (e.key === 'Escape') onClose();
else if (e.key === 'ArrowRight') onNext();
else if (e.key === 'ArrowLeft') onPrev();
};
window.addEventListener('keydown', onKey);
const prev = document.body.style.overflow;
document.body.style.overflow = 'hidden';
return () => { window.removeEventListener('keydown', onKey); document.body.style.overflow = prev; };
}, [onClose, onPrev, onNext]);
const photos = V_ALPINE.photos.gallery;
const img = photos[index];
if (!img) return null;
const label = trA(img.caption, lang);
const tone = TONE[TONES[index % 3]];
const roundBtn = { width: 48, height: 48, borderRadius: '50%', border: 'none', background: 'rgba(255,252,247,0.92)',
color: 'var(--ink)', cursor: 'pointer', display: 'grid', placeItems: 'center', boxShadow: 'var(--shadow)' };
return (
{index + 1} / {photos.length}
{label}
{img.photo ? (
) : (
)}
{photos.map((g, i) => {
const gt = TONE[TONES[i % 3]];
const active = i === index;
return (
);
}
// ─── PAGE ───────────────────────────────────────────────────────────────
function VariantAlpine() {
const [lang, setLang] = useState('fr');
const [lightboxIdx, setLightboxIdx] = useState(null);
const n = V_ALPINE.photos.gallery.length;
const open = useCallback((i) => setLightboxIdx(i), []);
const close = useCallback(() => setLightboxIdx(null), []);
const goNext = useCallback(() => setLightboxIdx(i => (i + 1) % n), [n]);
const goPrev = useCallback(() => setLightboxIdx(i => (i - 1 + n) % n), [n]);
const bk = useBooking(lang);
const rv = useReviews(lang);
const rates = useRates(lang);
const price = Math.min(...rates.map(r => r.price));
return (
{lightboxIdx !== null && (
)}
);
}
window.VariantAlpine = VariantAlpine;