{message || (isLogged ? 'logged day' : 'empty until saved')}
);
}
// ═══════════════════════════════════════════════════════════════
// ABOUT TAB
// ═══════════════════════════════════════════════════════════════
function WebAbout() {
const isNarrow = useIsNarrow();
return (
recent balance, made visible.
CICO turns manual daily calorie totals into a simple storage trend: gaining, keeping, or losing. It compares recent intake with your estimated maintenance and shows the result as a fluid storage vessel.
The default reading window is three days. You can make it longer in Settings.
Missing recent days are held at maintenance and labeled as assumptions instead of copying today's intake.
Projection copy is intentionally cautious. It is a rough calorie-balance estimate, not a measured weight forecast or a recommendation.
);
}
function AboutNote({ title, stat, body }) {
return (
{title}
{stat}
{body}
);
}
function AboutMethod({ label, text }) {
return (
);
}
function WeeklyBars({ weeks, tdee = TDEE }) {
// each bar: vertical, anchored at center line. up = gaining (rust), down = losing (moss).
const H = 80;
const max = Math.max(800, ...weeks.map((w) => Math.abs(w.avg || 0))) * 1.1;
return (
{/* center axis */}
{weeks.map((w, i) => {
if (w.avg == null) {
return (
N/A
w{i + 1}
);
}
const zone = classify(w.avg, tdee);
const color = ZONES[zone].hex;
const h = Math.abs(w.avg) / max * (H / 2);
const top = w.avg >= 0 ? H / 2 - h : H / 2;
return (
w{i + 1}
= 0 ? top - 14 : top + h + 2,
fontSize: 10, color: 'var(--ink-2)',
}}>{w.avg > 0 ? '+' : ''}{Math.round(w.avg)}
{canShowProjection ? <>if this continued, four weeks{' '}
could be around{' '} : <>projection is{' '}}
{canShowProjection ? endWeight : 'N/A'}
{canShowProjection && {weightLabel}}.
{canShowProjection
? <>That implies about {projSign}{proj4w} {weightLabel} over four weeks from today's {startWeightDisplay} {weightLabel}, based on {loggedDays.length} logged days and assuming the recent pattern continued.
This is a simple calorie-balance estimate, not a recommendation or measured weight forecast.{assumptionNote}
: <>N/A until at least seven daily totals are logged. You have {loggedDays.length} logged {loggedDays.length === 1 ? 'day' : 'days'} so far, so the app avoids a future-weight estimate here.{assumptionNote}}
{canShowProjection
?
: }
{/* insight cards */}
{hasPatternData ? : }
{scenario.dailyTotalOnly ? : }
0 ? '+' : ''}${Math.round(loggedAvg)}`} text="kcal/day average on logged days." color={accent} />
);
}
function getBestKeepingRun(days, tdee) {
let best = 0;
let current = 0;
days.forEach((day) => {
if (day.intakeSource === 'logged' && Number.isFinite(day.balance) && classify(day.balance, tdee) === 'keeping') {
current++;
best = Math.max(best, current);
} else {
current = 0;
}
});
return best;
}
function ProjectionChart({ startKg, weeklyKg, weeks, accent }) {
const W = 380, H = 200;
const padL = 36, padR = 12, padT = 18, padB = 28;
const innerW = W - padL - padR, innerH = H - padT - padB;
// y range ±2 kg from start
const yMin = startKg - 2, yMax = startKg + 2;
const yScale = (kg) => padT + (yMax - kg) / (yMax - yMin) * innerH;
const xScale = (w) => padL + (w / weeks) * innerW;
// historical line: last 4 weeks held flat-ish (just decorative based on weeklyKg / 3)
const hist = [];
for (let w = -4; w <= 0; w++) {
hist.push({ w, kg: startKg - (weeklyKg / 3) * (w + 4) });
}
const proj = [];
for (let w = 0; w <= weeks; w++) {
proj.push({ w, kg: startKg + weeklyKg * w });
}
// Map historical x onto same scale (-4..0 → leftmost 40% of innerW)
const histX = (w) => padL + ((w + 4) / 4) * (innerW * 0.42);
const projX = (w) => padL + innerW * 0.42 + (w / weeks) * (innerW * 0.58);
return (
);
}
function InsightCard({ title, eyebrow, children }) {
return (
{dowAvg.map((v, i) => {
const zone = classify(v, tdee);
const color = ZONES[zone].hex;
const h = Math.abs(v) / max * (H / 2 - 8);
const top = v >= 0 ? H / 2 - h : H / 2;
return (
{labels[i]}
);
})}
);
}
function EmptyDataView({ title, detail }) {
return (
N/A
{title}
{detail}
);
}
function InsufficientData({ label, detail }) {
return (
{label}
{detail && {detail}}
);
}
function DailyTotalSummary({ days, tdee }) {
if (days.length === 0) {
return ;
}
const max = Math.max(1, ...days.map((day) => Math.abs(day.balance)));
return (
{days.map((day, index) => {
const zone = classify(day.balance, tdee);
const color = ZONES[zone].hex;
const width = Math.max(8, Math.abs(day.balance) / max * 100);
return (
{displayDate(day.date)}
{day.balance > 0 ? '+' : ''}{day.balance}
);
})}
);
}
function MealClock({ meals }) {
// 24h ring with dots at meal times
const cx = 70, cy = 70, R = 56;
return (
);
}
function ObsList({ children }) {
return
{children}
;
}
function Obs({ hi, text, color }) {
return (
{hi}{text}
);
}
function parseEntryDate(day) {
if (day.dateObj instanceof Date) return day.dateObj;
const parsed = new Date(day.date);
if (!Number.isNaN(parsed.getTime())) return parsed;
const fallback = new Date();
fallback.setDate(day.d || fallback.getDate());
return fallback;
}
Object.assign(window, { WebHistory, WebInsights, WebAbout });