Files
fn_registry/cpp/functions/viz/kpi_card.cpp
T
egutierrez 1a6e3cbeaf feat(cpp/viz): static-plot primitive + tooltips + rotated labels + card compacta
Nuevo primitivo compartido:
- cpp/functions/viz/plot_static.h: header-only con flags ImPlotFlags /
  ImPlotAxisFlags agrupados (NoFrame|NoMenus|NoBoxSelect|NoMouseText +
  Lock|NoInitialFit|NoHighlight) para visualizacion estatica en
  dashboards. Lo usan todos los charts de viz/.

Charts refactorizados a v1.1 con parametro `height` explicito (rompe el
feedback loop con contenedores AutoResizeY que producia vibracion al
redimensionar) y ejes pineados con ImPlotCond_Always:
- bar_chart v1.2: tooltip al hover (label + valor) + auto-rotacion de
  labels a 45 cuando no caben horizontalmente (medidos con CalcTextSize
  vs ancho del plot). Los labels rotados se dibujan manualmente con
  ImDrawList::PrimQuadUV + ImFontBaked::FindGlyph (API ImGui 1.92+).
- pie_chart v1.1: tooltip por slice (detecta cual via atan2 desde centro
  en sentido CCW matematico, que es como ImPlot dibuja los slices desde
  angle0=90) con label + valor + porcentaje. Aspect 1:1 mantenido.
- line_plot, scatter_plot, histogram v1.1: ejes pineados con limites
  calculados de min/max + 5% headroom (histogram usa AutoFit por los
  bins dinamicos, con Lock para bloquear pan/zoom).

kpi_card v1.2: card mas compacta — altura 78px (antes 108), font scale
1.4x (antes 1.8x), padding sm (antes md). Apto para densidades altas
de KPIs en dashboards.

fullscreen_window v0.2: NoScrollbar|NoScrollWithMouse para eliminar el
scrollbar fugaz que aparecia cuando el contenido excedia por 1-2px la
ventana, reflow de ancho y vibracion visible al redimensionar.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-24 21:31:00 +02:00

90 lines
3.7 KiB
C++

#include "kpi_card.h"
#include "sparkline.h"
#include "core/tokens.h"
#include <imgui.h>
#include <cstdio>
void kpi_card(const char* label, float value, float delta_percent,
const float* history, int history_count,
const char* format) {
using namespace fn_tokens;
// Card container — surface bg, border, rounded, padding.
// Mirrors Mantine <Paper withBorder shadow="xs" radius="md" p="md" /> usado
// en @fn_library/kpi_card.tsx, adaptado a ImGui dark theme via tokens.
ImGui::PushStyleColor(ImGuiCol_ChildBg, colors::surface);
ImGui::PushStyleColor(ImGuiCol_Border, colors::border);
ImGui::PushStyleVar(ImGuiStyleVar_ChildRounding, radius::md);
ImGui::PushStyleVar(ImGuiStyleVar_ChildBorderSize, 1.0f);
ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(spacing::sm, spacing::sm));
// Unique child id por label para que multiples cards en la misma ventana
// no colisionen.
char child_id[96];
std::snprintf(child_id, sizeof(child_id), "##kpi_%s", label);
float width = ImGui::GetContentRegionAvail().x;
if (width < 1.0f) width = 1.0f;
// Altura fija (no AutoResizeY) para que:
// (a) todas las cards de un grid queden alineadas visualmente,
// (b) no haya recalculo de layout por card en cada resize de la ventana.
// 78px alcanza para: label (~14px) + value (~22px con escala x1.4) + trend
// (~14px) + padding sm*2 (~16px) ≈ 66px, +12px de aire.
constexpr float card_height = 78.0f;
ImGui::BeginChild(child_id, ImVec2(width, card_height),
ImGuiChildFlags_Borders,
ImGuiWindowFlags_NoScrollbar | ImGuiWindowFlags_NoScrollWithMouse);
// Label — muted
ImGui::PushStyleColor(ImGuiCol_Text, colors::text_muted);
ImGui::TextUnformatted(label);
ImGui::PopStyleColor();
// Value — escala compacta 1.4x, proporcional a una card de 78px.
// El format controla el sufijo (ej: "%.0f%%" para porcentajes).
ImGui::SetWindowFontScale(1.4f);
char value_buf[64];
std::snprintf(value_buf, sizeof(value_buf), format, value);
ImGui::TextUnformatted(value_buf);
ImGui::SetWindowFontScale(1.0f);
// Delta / trend — SIEMPRE se reserva la linea aunque no haya tendencia,
// para que todas las cards tengan la misma altura. Cuando no hay delta
// ni history, se muestra un guion en text_dim para mantener el ritmo
// visual sin hacer ruido con "+0.0%".
const bool has_delta = delta_percent != 0.0f;
const bool has_history = history != nullptr && history_count > 0;
if (has_delta) {
const bool positive = delta_percent >= 0.0f;
const ImVec4 delta_color = positive ? colors::success : colors::error;
char delta_buf[32];
if (positive) {
std::snprintf(delta_buf, sizeof(delta_buf), "\xe2\x96\xb2 +%.1f%%", delta_percent);
} else {
std::snprintf(delta_buf, sizeof(delta_buf), "\xe2\x96\xbc %.1f%%", delta_percent);
}
ImGui::PushStyleColor(ImGuiCol_Text, delta_color);
ImGui::TextUnformatted(delta_buf);
ImGui::PopStyleColor();
if (has_history) {
sparkline(label, history, history_count, delta_color, 120.0f, 24.0f);
}
} else if (has_history) {
// Sin delta pero con historia: sparkline en primary (neutro).
sparkline(label, history, history_count, colors::primary, 120.0f, 24.0f);
} else {
// Placeholder para preservar altura de la card.
ImGui::PushStyleColor(ImGuiCol_Text, colors::text_dim);
ImGui::TextUnformatted("\xe2\x80\x94"); // em dash
ImGui::PopStyleColor();
}
ImGui::EndChild();
ImGui::PopStyleVar(3);
ImGui::PopStyleColor(2);
}