import React, { useState, useEffect, useRef } from 'react'; import { createRoot } from 'react-dom/client'; import { ShoppingBag, X, Plus, Minus, MapPin, Clock, Phone, MessageCircle, ChefHat, Thermometer, Sparkles, Flame, ArrowRight, ArrowLeft, Smartphone } from 'lucide-react'; // ============ PRODUCTS DATA ============ const PRODUCTS = { carnes: [ { id: 'c1', name: 'Bife do Lombo', sub: 'Vaca', price: 28.90, unit: 'kg', desc: 'Corte nobre, extra macio. A peça mais procurada do balcão.', tip: 'Frigideira bem quente, 2 min cada lado.', temp: '52°C mal · 57°C médio', tone: 'from-red-900 to-red-700' }, { id: 'c2', name: 'Vazia', sub: 'Vaca', price: 19.50, unit: 'kg', desc: 'Saborosa e versátil. O clássico para o bife do dia a dia.', tip: 'Sal grosso na hora. Manteiga e alho no fim.', temp: '54°C ao ponto', tone: 'from-red-900 to-red-700' }, { id: 'c3', name: 'Alcatra', sub: 'Vaca', price: 17.90, unit: 'kg', desc: 'Equilíbrio entre maciez e sabor.', tip: 'Excelente para grelhar inteira e fatiar.', temp: '55°C ao ponto', tone: 'from-red-900 to-red-700' }, { id: 'c4', name: 'Carne Picada', sub: 'Vaca', price: 9.90, unit: 'kg', desc: 'Picada na hora, sem aditivos.', tip: 'Para hambúrgueres caseiros, não amasse demais.', temp: '70°C interior', tone: 'from-red-900 to-red-700' }, { id: 'c5', name: 'Entremeada', sub: 'Porco', price: 8.50, unit: 'kg', desc: 'Camadas de carne e gordura. Ideal para o churrasco.', tip: 'Marinada em vinho branco, alho e colorau.', temp: '75°C interior', tone: 'from-orange-900 to-amber-700' }, { id: 'c6', name: 'Lombo de Porco', sub: 'Porco', price: 11.90, unit: 'kg', desc: 'Magro e tenro. Para assar inteiro ou cortar em medalhões.', tip: 'Cuidado para não passar do ponto.', temp: '63°C interior', tone: 'from-orange-900 to-amber-700' }, { id: 'c7', name: 'Frango do Campo', sub: 'Aves', price: 6.90, unit: 'kg', desc: 'Frango inteiro, criado ao ar livre. Sabor a sério.', tip: 'Esfregar com limão e ervas por dentro.', temp: '74°C no peito', tone: 'from-amber-800 to-yellow-700' }, { id: 'c8', name: 'Chouriço Tradicional', sub: 'Enchidos', price: 14.50, unit: 'kg', desc: 'Receita da casa. Curado lentamente.', tip: 'À brasa ou cru em fatias finas.', temp: 'Pronto a consumir', tone: 'from-red-950 to-red-800' } ], preparados: [ { id: 'p1', name: 'Espetadas Mistas', sub: 'Espetadas', price: 13.90, unit: 'kg', desc: 'Vaca, porco e pimentos. Já temperadas.', tip: 'Brasa média-alta. 4 min cada lado.', temp: 'Brasa média-alta', tone: 'from-amber-800 to-orange-700' }, { id: 'p2', name: 'Frango Recheado', sub: 'Recheados', price: 9.90, unit: 'kg', desc: 'Frango inteiro recheado, pronto para o forno.', tip: 'Forno a 190°C durante 1h-1h15.', temp: '74°C no peito', tone: 'from-orange-900 to-amber-700' }, { id: 'p3', name: 'Hambúrguer da Casa', sub: 'Almôndegas', price: 14.90, unit: 'kg', desc: 'Picado na hora, moldado à mão.', tip: 'Frigideira ou grelha bem quente.', temp: '63°C ao ponto', tone: 'from-amber-800 to-orange-700' }, { id: 'p4', name: 'Bife Wellington', sub: 'Folhados', price: 22.90, unit: 'kg', desc: 'Lombo em massa folhada, especialidade clássica.', tip: 'Forno a 200°C durante 25-30 min.', temp: '57°C ao ponto', tone: 'from-yellow-800 to-amber-700' }, { id: 'p5', name: 'Lasanha', sub: 'Para Forno', price: 11.90, unit: 'kg', desc: 'Lasanha de carne, pronta para o forno.', tip: 'Forno a 180°C, 35-40 min.', temp: 'Topo gratinado', tone: 'from-rose-900 to-red-800' }, { id: 'p6', name: 'Croquetes', sub: 'Empanados', price: 9.90, unit: 'kg', desc: 'Croquetes da casa, prontos a fritar.', tip: 'Air fryer 200°C, 10 min.', temp: 'Dourados', tone: 'from-yellow-800 to-amber-700' } ] }; const CATEGORY_META = { carnes: { title: 'Carnes', sub: 'Frescas · Ao Natural', desc: 'Vaca, porco, borrego, aves e enchidos. Cortados na hora.', tone: 'from-red-900 to-red-700', icon: Sparkles }, preparados: { title: 'Preparados', sub: 'Prontos a cozinhar', desc: 'Espetadas, hambúrgueres, lasanhas. Prontos a aquecer e servir.', tone: 'from-amber-800 to-orange-700', icon: Flame } }; // ============ LOGO ============ const Logo = ({ className = 'w-10 h-10' }) => ( ); // ============ QR CODE (real, aponta para talhodaluz.pt) ============ const FakeQR = ({ size = 128, url = 'https://talhodaluz.pt' }) => (
{`QR
); // ============ COUNT UP ============ function CountUp({ end, suffix = '', start = false }) { const [value, setValue] = useState(0); useEffect(() => { if (!start) return; let frame, startTime; const animate = (t) => { if (!startTime) startTime = t; const progress = Math.min((t - startTime) / 2000, 1); const eased = 1 - Math.pow(1 - progress, 3); setValue(Math.floor(eased * end)); if (progress < 1) frame = requestAnimationFrame(animate); else setValue(end); }; frame = requestAnimationFrame(animate); return () => cancelAnimationFrame(frame); }, [start, end]); return <>{value}{suffix}; } // ============ PRODUCT CARD ============ const ProductCard = ({ p, onClick }) => ( ); // ============ PRODUCT MODAL ============ function ProductModal({ product, onClose, onAdd }) { const [qty, setQty] = useState(0.5); return ( <>
Foto em breve
{product.sub}
{product.sub}

{product.name}

{product.price.toFixed(2)}€ /{product.unit}

{product.desc}

Quantidade ({product.unit})
{qty} {product.unit}
Total {(qty * product.price).toFixed(2)}€
Mini-lição da casa

{product.tip}

{product.temp}
); } // ============ CART DRAWER ============ function CartDrawer({ cart, updateQty, cartTotal, onClose }) { return ( <>

A sua encomenda

{cart.length} {cart.length === 1 ? 'artigo' : 'artigos'}
{cart.length === 0 ? (

O carrinho ainda está vazio.

) : ( <>
{cart.map(i => (
{i.name}
{i.price.toFixed(2)}€/{i.unit}
{i.qty} {i.unit}
{(i.qty * i.price).toFixed(2)}€
))}
Total {cartTotal.toFixed(2)}€

Sem entregas. Levante na loja, no Mercado do Livramento.

)}
); } // ============ CONFIRMATION DIALOG ============ function ConfirmationDialog({ product, qty, onContinue, onViewCart, onClose }) { return ( <>
Adicionado!
{product.name}
{qty} {product.unit} · {(qty * product.price).toFixed(2)}€

Deseja continuar a comprar ou ir para o carrinho?

); } // ============ MOBILE INSTALL STRIP ============ function MobileInstallStrip() { return (
No telemóvel

Tenha o talho no bolso.

Aceda ao site pelo telemóvel e instale como aplicação no seu ecrã principal. Compras rápidas, sem barras do navegador, mesmo com rede fraca.

Aponte com a câmara
talhodaluz.pt
); } // ============ SITE HEADER (sticky, simplified — só logo + carrinho) ============ function SiteHeader({ cartCount, onLogoClick, onCartClick }) { return (
); } // ============ SITE FOOTER ============ function SiteFooter() { return ( ); } // ============ HOME PAGE ============ function HomePage({ onCategoryClick, onScrollSection }) { const aboutRef = useRef(null); const [aboutShown, setAboutShown] = useState(false); useEffect(() => { const el = aboutRef.current; if (!el) return; const obs = new IntersectionObserver(([entry]) => { if (entry.isIntersecting) setAboutShown(true); }, { threshold: 0.3 }); obs.observe(el); return () => obs.disconnect(); }, []); return (
{/* HERO */}
Desde 1930 · Mercado do Livramento

Do talho
para a sua mesa.

Tradição evoluída no coração de Setúbal.

{/* SOBRE */}
Quem Somos

Tradição evoluída,
feita à mão.

Estamos no Mercado do Livramento há gerações. Conhecemos cada corte, cada peça, cada cliente.

O que mudou foi a forma de chegarmos a si. O que se mantém é o que importa.

{[{ end: 95, suffix: '+', label: 'anos no mercado' }, { end: 3, suffix: '', label: 'gerações' }, { end: 100, suffix: '%', label: 'fresco diário' }].map(s => (
{s.label}
))}
{/* PRODUTOS — clicar leva para a página da categoria */}
Os Nossos Produtos

Dois mundos
no mesmo balcão.

Escolha o seu mundo para ver os produtos disponíveis.

{['carnes', 'preparados'].map(cat => { const meta = CATEGORY_META[cat]; return ( ); })}
{/* MOBILE INSTALL */} {/* CONTACTO */}
Visite-nos

Apareça lá pelo
mercado.

Mercado do Livramento
Loja 15A · 2900-462 Setúbal
Horário
Ter–Sex · 7h–19h
Sáb · 7h–14h e 16h–18h
Dom e Feriados · 7h–14h
Contacto
964 595 456
); } // ============ SHOP PAGE ============ function ShopPage({ cat, onBackHome, onProductClick, onSwitchCategory }) { const [filterSub, setFilterSub] = useState('Todos'); const meta = CATEGORY_META[cat]; const subs = [...new Set(PRODUCTS[cat].map(p => p.sub))]; const filtered = filterSub === 'Todos' ? PRODUCTS[cat] : PRODUCTS[cat].filter(p => p.sub === filterSub); const otherCat = cat === 'carnes' ? 'preparados' : 'carnes'; // Reset filter when category changes useEffect(() => { setFilterSub('Todos'); }, [cat]); return (
{/* BREADCRUMB + HERO */}
/ {meta.title}
{meta.sub}

{meta.title}

{meta.desc}

Disponíveis
{PRODUCTS[cat].length}
{/* FILTERS + GRID */}
{subs.map(s => ( ))}
{filtered.length} {filtered.length === 1 ? 'produto' : 'produtos'}
{filtered.map(p => onProductClick(p)} />)}
Também temos
); } // ============ MAIN APP ============ function App() { const [page, setPage] = useState('home'); const [activeCat, setActiveCat] = useState('carnes'); const [cart, setCart] = useState([]); const [cartOpen, setCartOpen] = useState(false); const [selectedProduct, setSelectedProduct] = useState(null); const [confirmedItem, setConfirmedItem] = useState(null); const cartCount = cart.reduce((s, i) => s + i.qty, 0); const cartTotal = cart.reduce((s, i) => s + i.qty * i.price, 0); const goHome = () => { setPage('home'); window.scrollTo({ top: 0, behavior: 'auto' }); }; const goToCategory = (cat) => { setActiveCat(cat); setPage('shop'); window.scrollTo({ top: 0, behavior: 'auto' }); }; const scrollToSection = (id) => { const el = document.getElementById(id); if (el) { const headerHeight = 76; const top = el.getBoundingClientRect().top + window.scrollY - headerHeight; window.scrollTo({ top, behavior: 'smooth' }); } }; const addToCart = (p, qty) => { setCart(c => { const ex = c.find(i => i.id === p.id); if (ex) return c.map(i => i.id === p.id ? { ...i, qty: +(i.qty + qty).toFixed(2) } : i); return [...c, { id: p.id, name: p.name, price: p.price, unit: p.unit, qty }]; }); setConfirmedItem({ product: p, qty }); setSelectedProduct(null); }; const updateQty = (id, qty) => { if (qty <= 0) setCart(c => c.filter(i => i.id !== id)); else setCart(c => c.map(i => i.id === id ? { ...i, qty } : i)); }; const handleContinueShopping = () => { setConfirmedItem(null); window.scrollTo({ top: 0, behavior: 'smooth' }); }; const handleViewCart = () => { setConfirmedItem(null); setCartOpen(true); }; return (
setCartOpen(true)} /> {page === 'home' ? ( ) : ( setSelectedProduct(p)} onSwitchCategory={goToCategory} /> )} {selectedProduct && ( setSelectedProduct(null)} onAdd={addToCart} /> )} {cartOpen && ( setCartOpen(false)} /> )} {confirmedItem && ( setConfirmedItem(null)} /> )}
); } createRoot(document.getElementById('root')).render();