/* global React */
const { useState: pUseState, useEffect: pUseEffect } = React;
// ─── Wordmark ───────────────────────────────────────────
function Wordmark({ size = 28, color }) {
return (
Kaleidos
·
Pay
);
}
// ─── SectionHead ────────────────────────────────────────
function SectionHead({ num, sub, tag, children }) {
return (
{num}
{sub}
{children}
{tag && (
{tag}
)}
);
}
// ─── Temperature pill ───────────────────────────────────
function TempPill({ temp }) {
const map = {
fervendo: { cls: "tempo-hot", label: "🔥 Fervendo" },
quente: { cls: "tempo-hot", label: "🔥 Quente" },
morno: { cls: "tempo-warm", label: "Morno" },
frio: { cls: "tempo-cold", label: "Frio" },
congelado:{ cls: "tempo-frozen", label: "Sem sinal" },
};
const m = map[temp] || map.frio;
return {m.label};
}
// ─── Status chip ────────────────────────────────────────
function StatusChip({ status }) {
const map = {
aceita: { cls: "status-chip--accept", label: "Aceita" },
rejeitada: { cls: "status-chip--reject", label: "Recusada" },
viewing: { cls: "status-chip--sent", label: "Lendo agora" },
sent: { cls: "status-chip--pending", label: "Aguardando" },
expirada: { cls: "status-chip--pending", label: "Expirada" },
};
const m = map[status] || map.sent;
return {m.label};
}
// ─── Format helpers ─────────────────────────────────────
function brl(n) {
return n.toLocaleString("pt-BR", { style: "currency", currency: "BRL", minimumFractionDigits: 2 });
}
function fmtDur(seg) {
const m = Math.floor(seg / 60);
const s = seg % 60;
if (m === 0) return `${s}s`;
return `${m}min ${String(s).padStart(2, "0")}s`;
}
// ─── Avatar ─────────────────────────────────────────────
function Avatar({ initials, size = 44, bg = "var(--kp-soft)" }) {
return (
{initials}
);
}
// ─── Tiny SVG icons ─────────────────────────────────────
const Icon = {
eye: (p) => (),
clock: (p) => (),
flame: (p) => (),
send: (p) => (),
check: (p) => (),
edit: (p) => (),
arrow: (p) => (),
back: (p) => (),
sparkle: (p) => (),
link: (p) => (),
copy: (p) => (),
whatsapp: (p) => (),
mail: (p) => (),
};
window.SEQ_UI = { Wordmark, SectionHead, TempPill, StatusChip, Avatar, Icon, brl, fmtDur };