/* global React */
const { useState, useEffect, useRef, useCallback } = React;
// ============================================================
// ICONS — simple geometric only
// ============================================================
// Default width/height baked into each SVG so they NEVER render at the browser's
// default 300x150 size if styles.css fails to load or is delayed. CSS rules still
// override (CSS beats SVG attributes).
const ICON_BASE = { width: 24, height: 24 };
const Icon = {
Phone: (p) => ,
WA: (p) => ,
Check: (p) => ,
Star: (p) => ,
Arrow: (p) => ,
Shield: (p) => ,
Drop: (p) => ,
Pipe: (p) => ,
Wrench: (p) => ,
Toilet: (p) => ,
Grid: (p) => ,
Bolt: (p) => ,
Water: (p) => ,
Factory: (p) => ,
Plus: (p) => ,
Lock: (p) => ,
Clock: (p) => ,
Truck: (p) => ,
X: (p) => ,
};
// ============================================================
// HELPERS
// ============================================================
const PHONE = "5562992910049";
const PHONE_DISPLAY = "(62) 99291-0049";
function waLink(message) {
const m = message || "Olá! Preciso de atendimento urgente da Desentupidora Rei.";
return `https://wa.me/${PHONE}?text=${encodeURIComponent(m)}`;
}
function maskPhone(v) {
const d = v.replace(/\D/g, "").slice(0, 11);
if (d.length <= 2) return d ? `(${d}` : "";
if (d.length <= 7) return `(${d.slice(0,2)}) ${d.slice(2)}`;
return `(${d.slice(0,2)}) ${d.slice(2,7)}-${d.slice(7)}`;
}
function StarRow({ n = 5 }) {
return (
{Array.from({ length: n }).map((_, i) => )}
);
}
// ============================================================
// BUTTONS
// ============================================================
function WAButton({ children, message, size, block, kind = "wa" }) {
const cls = `btn btn-${kind} ${size === "lg" ? "btn-lg" : ""} ${block ? "btn-block" : ""}`;
return (
{children}
);
}
function CallButton({ children, kind = "ghost", size, block }) {
const cls = `btn btn-${kind} ${size === "lg" ? "btn-lg" : ""} ${block ? "btn-block" : ""}`;
return (
{children || `LIGAR ${PHONE_DISPLAY}`}
);
}
// ============================================================
// TOPBAR
// ============================================================
function Topbar() {
return (
);
}
// ============================================================
// ALERT BAR
// ============================================================
function AlertBar({ equipes = 3 }) {
return (
Alerta de rota: {equipes} equipes em atendimento agora · Sua região ainda tem técnico disponível
);
}
// Export to window for cross-file usage
Object.assign(window, { Icon, PHONE, PHONE_DISPLAY, waLink, maskPhone, StarRow, WAButton, CallButton, Topbar, AlertBar });
