Create edge_strip.py

visualization/edge_strip.py

@@ -0,0 +1,103 @@
+from __future__ import annotations
+
+from typing import Any
+
+import streamlit as st
+
+
+def _fmt_odds(value: Any) -> str:
+    if value is None:
+        return "—"
+    try:
+        iv = int(value)
+        return f"+{iv}" if iv > 0 else str(iv)
+    except Exception:
+        return str(value)
+
+
+def _fmt_edge(value: Any) -> str:
+    try:
+        return f"{float(value):+.1%}"
+    except Exception:
+        return "—"
+
+
+def render_live_edge_strip(edge: dict[str, Any]) -> None:
+    batter_name = edge.get("batter_name", "") or "Current Batter"
+
+    st.markdown(
+        f"""
+        <div style="
+            margin-top:-4px;
+            margin-bottom:14px;
+            background: rgba(255,255,255,0.03);
+            border: 1px solid rgba(148,163,184,0.14);
+            border-radius: 16px;
+            padding: 12px;
+        ">
+            <div style="color:#94a3b8;font-size:12px;font-weight:700;margin-bottom:8px;">
+                LIVE EDGE STRIP • {batter_name}
+            </div>
+
+            <div style="
+                display:grid;
+                grid-template-columns: 1.2fr 0.8fr 0.8fr 0.7fr;
+                gap:8px;
+                color:#94a3b8;
+                font-size:11px;
+                font-weight:700;
+                margin-bottom:6px;
+            ">
+                <div>MARKET</div>
+                <div>FAIR</div>
+                <div>BOOK</div>
+                <div>EDGE</div>
+            </div>
+
+            <div style="
+                display:grid;
+                grid-template-columns: 1.2fr 0.8fr 0.8fr 0.7fr;
+                gap:8px;
+                color:#e2e8f0;
+                font-size:13px;
+                font-weight:700;
+                margin-bottom:4px;
+            ">
+                <div>Hit</div>
+                <div>{_fmt_odds(edge.get("fair_hit_odds"))}</div>
+                <div>{_fmt_odds(edge.get("book_hit_odds"))}</div>
+                <div>{_fmt_edge(edge.get("hit_edge"))}</div>
+            </div>
+
+            <div style="
+                display:grid;
+                grid-template-columns: 1.2fr 0.8fr 0.8fr 0.7fr;
+                gap:8px;
+                color:#e2e8f0;
+                font-size:13px;
+                font-weight:700;
+                margin-bottom:4px;
+            ">
+                <div>HR</div>
+                <div>{_fmt_odds(edge.get("fair_hr_odds"))}</div>
+                <div>{_fmt_odds(edge.get("book_hr_odds"))}</div>
+                <div>{_fmt_edge(edge.get("hr_edge"))}</div>
+            </div>
+
+            <div style="
+                display:grid;
+                grid-template-columns: 1.2fr 0.8fr 0.8fr 0.7fr;
+                gap:8px;
+                color:#e2e8f0;
+                font-size:13px;
+                font-weight:700;
+            ">
+                <div>2+ TB</div>
+                <div>{_fmt_odds(edge.get("fair_tb2p_odds"))}</div>
+                <div>{_fmt_odds(edge.get("book_tb2p_odds"))}</div>
+                <div>{_fmt_edge(edge.get("tb2p_edge"))}</div>
+            </div>
+        </div>
+        """,
+        unsafe_allow_html=True,
+    )