---
name: page_header
kind: component
lang: cpp
domain: core
version: "1.0.0"
purity: pure
signature: "bool page_header_begin(const char* title, const char* subtitle = nullptr); void page_header_end(); void page_header(const char* title, const char* subtitle = nullptr)"
description: "Header de página con título, subtítulo opcional y separator final. Equivalente al <PageHeader> de @fn_library. Patrón begin/end permite insertar acciones (botones) en el hueco entre título y separator."
tags: [imgui, header, page-header, ui, layout, design-system]
uses_functions:
  - tokens_cpp_core
uses_types: []
returns: []
returns_optional: false
error_type: ""
imports: [imgui]
tested: true
tests:
  - "compiles and links against Catch2 (placeholder, visual cubierto en 0048)"
test_file_path: "cpp/tests/test_page_header.cpp"
file_path: "cpp/functions/core/page_header.cpp"
framework: imgui
params:
  - name: title
    desc: "Título principal de la página (font scale 1.4x)"
  - name: subtitle
    desc: "Subtítulo opcional en texto muted"
output: "Renderiza título + subtítulo + separator. page_header_begin devuelve true siempre (idiom estilístico)."
---

# page_header

Header consistente para dashboards y páginas ImGui. Título destacado, subtítulo en muted, separador abajo. Entre medias hay un hueco para que el caller inserte acciones (botones Refresh, filtros, etc.).

## Uso

### Con acciones

```cpp
#include "core/page_header.h"

page_header_begin("fn_registry Dashboard",
                  "865 functions · 152 types · 12 apps");
ImGui::SameLine(ImGui::GetWindowWidth() - 120.0f);
if (ImGui::Button("Reload")) { trigger_reload(); }
page_header_end();
```

### Sin acciones (forma corta)

```cpp
page_header("Settings", "Application preferences");
```

## Notas

- El título se renderiza con `SetWindowFontScale(1.4f)` — si tu atlas incluye varias fuentes, sustituir por PushFont con una fuente más grande para mejor rendering.
- El subtítulo usa `fn_tokens::colors::text_muted`.
- El separator y el espaciado antes/después son determinísticos (spacing::sm) para consistencia entre páginas.
- Si necesitas tabs integrados en el header (como `PageHeader` en React con `tabs={...}`), componer con `tab_container` debajo del `page_header_end`.
