From 4d90ded387758d15ce2444ae9ed2f5924e675d32 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 17 Sep 2026 06:56:17 +0000
Subject: [PATCH 1/3] Align Python browser Summary Report presentation with R

- Pass sectionGroupPresentation: 'tabs', groupPresentation: 'tabs', and
  sectionComponentPresentation: 'tabs' to renderReport() in
  RtichokeBrowserReport.
- Embed Summary Report density CSS (_summary_report_density_css()) matching R's
  summary_report_density_css() behavior.
- Update unit tests to assert tabs presentation options and density CSS.

Co-authored-by: uriahf <11351434+uriahf@users.noreply.github.com>
---
 src/rtichoke/_report_browser.py      | 55 +++++++++++++++++++++++++++-
 tests/test_report_browser.py         |  5 ++-
 tests/test_summary_report_browser.py |  4 ++
 3 files changed, 62 insertions(+), 2 deletions(-)

diff --git a/src/rtichoke/_report_browser.py b/src/rtichoke/_report_browser.py
index 4611aec8..f086770b 100644
--- a/src/rtichoke/_report_browser.py
+++ b/src/rtichoke/_report_browser.py
@@ -49,6 +49,57 @@ def _sanitize_nan_values(obj: Any) -> Any:
     return obj
 
 
+def _summary_report_density_css() -> str:
+    """Generate layout density CSS for browser summary reports."""
+    return (
+        ".rtichoke-report {\n"
+        "  max-width: 1040px;\n"
+        "  gap: 1.5rem;\n"
+        "}\n"
+        ".rtichoke-report__section {\n"
+        "  gap: 1.25rem;\n"
+        "}\n"
+        ".rtichoke-report__group {\n"
+        "  gap: 0.875rem;\n"
+        "}\n"
+        ".rtichoke-report__component,\n"
+        ".rtichoke-report__tabpanel {\n"
+        "  gap: 0.5rem;\n"
+        "}\n"
+        ".rtichoke-report .rtichoke-viz-chart {\n"
+        "  min-height: 500px;\n"
+        "  height: 500px;\n"
+        "}\n"
+        ".rtichoke-report .rtichoke-calibration {\n"
+        "  min-height: 550px;\n"
+        "  height: 550px;\n"
+        "}\n"
+        ".rtichoke-report__tabpanel .rtichoke-report__component-title {\n"
+        "  display: none;\n"
+        "}\n"
+        ".rtichoke-report__nav {\n"
+        "  background-color: transparent;\n"
+        "  border: none;\n"
+        "  border-bottom: 1px solid #e5e7eb;\n"
+        "  border-radius: 0;\n"
+        "  padding: 0.5rem 0;\n"
+        "}\n"
+        ".rtichoke-report .rtichoke-summary-metrics {\n"
+        "  border: none;\n"
+        "  background: transparent;\n"
+        "  box-shadow: none;\n"
+        "}\n"
+        ".rtichoke-report .rtichoke-summary-metrics__title {\n"
+        "  display: none;\n"
+        "}\n"
+        ".rtichoke-report .rtichoke-summary-metrics__table th,\n"
+        ".rtichoke-report .rtichoke-summary-metrics__table td {\n"
+        "  padding: 0.35rem 0.65rem;\n"
+        "  border-bottom: 1px solid #e5e7eb;\n"
+        "}\n"
+    )
+
+
 class RtichokeBrowserReport:
     """A complete canonical ReportSpec rendered by shared ``rtichoke_viz``."""
 
@@ -76,6 +127,7 @@ def write_html(self, path: str | Path) -> Path:
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <style>
 {viz_css}
+{_summary_report_density_css()}
   </style>
   <title>rtichoke report</title>
 </head>
@@ -89,7 +141,8 @@ def write_html(self, path: str | Path) -> Path:
     );
     document.querySelector("#rtichoke-report").append({render_fn}(spec, {{
       sectionGroupPresentation: "tabs",
-      groupPresentation: "stacked"
+      groupPresentation: "tabs",
+      sectionComponentPresentation: "tabs"
     }}));
   </script>
 </body>
diff --git a/tests/test_report_browser.py b/tests/test_report_browser.py
index 525af9d2..6837b14a 100644
--- a/tests/test_report_browser.py
+++ b/tests/test_report_browser.py
@@ -68,7 +68,10 @@ def test_browser_report_uses_real_producers_and_only_shared_render_report(tmp_pa
     assert viz_css in html
     assert '<link rel="stylesheet" href="./rtichoke-viz.css">' not in html
     assert 'sectionGroupPresentation: "tabs"' in html
-    assert 'groupPresentation: "stacked"' in html
+    assert 'groupPresentation: "tabs"' in html
+    assert 'sectionComponentPresentation: "tabs"' in html
+    assert 'groupPresentation: "stacked"' not in html
+    assert ".rtichoke-report {\n  max-width: 1040px;" in html
     assert _embedded_report(html) == report
     assert [item["id"] for item in report["sections"][0]["items"]] == [
         "performance-table",
diff --git a/tests/test_summary_report_browser.py b/tests/test_summary_report_browser.py
index 5eed764d..f790800c 100644
--- a/tests/test_summary_report_browser.py
+++ b/tests/test_summary_report_browser.py
@@ -205,6 +205,10 @@ def test_browser_summary_report_is_opt_in_and_uses_real_canonical_components(
     assert '<link rel="stylesheet" href="./rtichoke-viz.css">' not in html
     assert "<style>" in html
     assert 'sectionGroupPresentation: "tabs"' in html
+    assert 'groupPresentation: "tabs"' in html
+    assert 'sectionComponentPresentation: "tabs"' in html
+    assert 'groupPresentation: "stacked"' not in html
+    assert ".rtichoke-report {\n  max-width: 1040px;" in html
 
 
 def test_browser_summary_report_executes_when_opened_directly(tmp_path):

From b414af972f094864451f5e98a99067f6c3a881a2 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 17 Sep 2026 07:28:26 +0000
Subject: [PATCH 2/3] Add component tab coverage to summary report browser
 acceptance test

- Extend test_browser_summary_report_prediction_distribution_components_render
  in test_summary_report_browser.py to verify component-level tabs (Calibration
  Smooth / Discrete and Discrimination curve tabs).
- Confirm non-zero chart SVG dimensions and zero console/page errors.

Co-authored-by: uriahf <11351434+uriahf@users.noreply.github.com>
---
 tests/test_summary_report_browser.py | 54 ++++++++++++++++++++++++++++
 1 file changed, 54 insertions(+)

diff --git a/tests/test_summary_report_browser.py b/tests/test_summary_report_browser.py
index f790800c..fd8f85d2 100644
--- a/tests/test_summary_report_browser.py
+++ b/tests/test_summary_report_browser.py
@@ -451,6 +451,60 @@ def test_browser_summary_report_prediction_distribution_components_render(tmp_pa
         assert bbox_ppcr["width"] > 0
         assert bbox_ppcr["height"] > 0
 
+        # 4. Component-level tab set verification: Calibration Smooth & Discrete
+        calib_smooth_tab = page.locator(
+            "button[aria-controls='panel-calibration-calibration-smooth']"
+        )
+        calib_discrete_tab = page.locator(
+            "button[aria-controls='panel-calibration-calibration']"
+        )
+        assert calib_smooth_tab.is_visible()
+        assert calib_discrete_tab.is_visible()
+
+        # Click Smooth tab and verify component & non-zero chart SVG dimensions
+        calib_smooth_tab.click()
+        smooth_comp = page.locator("[data-component-id='calibration-smooth']")
+        smooth_comp.wait_for()
+        assert smooth_comp.is_visible()
+        smooth_svg = smooth_comp.locator("svg").first
+        smooth_svg.wait_for()
+        smooth_bbox = smooth_svg.bounding_box()
+        assert smooth_bbox is not None
+        assert smooth_bbox["width"] > 0
+        assert smooth_bbox["height"] > 0
+
+        # Click Discrete tab and verify component & non-zero chart SVG dimensions
+        calib_discrete_tab.click()
+        discrete_comp = page.locator("[data-component-id='calibration']")
+        discrete_comp.wait_for()
+        assert discrete_comp.is_visible()
+        discrete_svg = discrete_comp.locator("svg").first
+        discrete_svg.wait_for()
+        discrete_bbox = discrete_svg.bounding_box()
+        assert discrete_bbox is not None
+        assert discrete_bbox["width"] > 0
+        assert discrete_bbox["height"] > 0
+
+        # 5. Component-level tab set verification: Discrimination Curve Tabs (ROC, Lift, PR, Gains)
+        disc_ppcr_group_tab = page.locator("button[aria-controls='discrimination-ppcr']")
+        disc_ppcr_group_tab.click()
+
+        lift_comp_tab = page.locator(
+            "button[aria-controls='panel-discrimination-ppcr-lift-2']"
+        )
+        assert lift_comp_tab.is_visible()
+        lift_comp_tab.click()
+
+        lift_comp = page.locator("[data-component-id='lift-2']")
+        lift_comp.wait_for()
+        assert lift_comp.is_visible()
+        lift_svg = lift_comp.locator("svg").first
+        lift_svg.wait_for()
+        lift_bbox = lift_svg.bounding_box()
+        assert lift_bbox is not None
+        assert lift_bbox["width"] > 0
+        assert lift_bbox["height"] > 0
+
         assert len(errors) == 0, f"Console errors found: {errors}"
         browser.close()
 

From 23af6b206e6d44674facf54cee4c19fa693473c7 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Thu, 17 Sep 2026 07:32:24 +0000
Subject: [PATCH 3/3] Apply ruff formatting to test_summary_report_browser.py

Fixes CI ruff format --check failure in build matrix.

Co-authored-by: uriahf <11351434+uriahf@users.noreply.github.com>
---
 tests/test_summary_report_browser.py | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/tests/test_summary_report_browser.py b/tests/test_summary_report_browser.py
index fd8f85d2..f7b182b3 100644
--- a/tests/test_summary_report_browser.py
+++ b/tests/test_summary_report_browser.py
@@ -486,7 +486,9 @@ def test_browser_summary_report_prediction_distribution_components_render(tmp_pa
         assert discrete_bbox["height"] > 0
 
         # 5. Component-level tab set verification: Discrimination Curve Tabs (ROC, Lift, PR, Gains)
-        disc_ppcr_group_tab = page.locator("button[aria-controls='discrimination-ppcr']")
+        disc_ppcr_group_tab = page.locator(
+            "button[aria-controls='discrimination-ppcr']"
+        )
         disc_ppcr_group_tab.click()
 
         lift_comp_tab = page.locator(