{# Reusable Jinja macros for wave-alpha UI.
Import in any template with: {% from "_macros.html" import pat, wlabel, pill, tri, icon, gloss %} #}
{# pat(name) — colored Elliott pattern badge. Maps known names; unknowns get .pat.unknown #}
{% macro pat(name) -%}
{% if not name %}—
{% else %}
{% set n = name|lower %}
{% if n == "impulse" %}{{ name }}
{% elif n == "zigzag" %}{{ name }}
{% elif n == "flat" %}{{ name }}
{% elif n == "expanded_flat" or n == "expanded flat" %}{{ name }}
{% elif n == "ending_diagonal" or n == "ending diagonal" %}{{ name }}
{% elif n == "contracting_triangle" or n == "contracting triangle" %}{{ name }}
{% else %}{{ name }}
{% endif %}
{% endif %}
{%- endmacro %}
{# wlabel(label) — 1..5 / A / B / C — circular wave label badge #}
{% macro wlabel(label) -%}
{% if not label %}·
{% else %}
{% set l = label|string|upper %}
{% if l == "1" %}1
{% elif l == "2" %}2
{% elif l == "3" %}3
{% elif l == "4" %}4
{% elif l == "5" %}5
{% elif l == "A" %}A
{% elif l == "B" %}B
{% elif l == "C" %}C
{% else %}{{ label }}
{% endif %}
{% endif %}
{%- endmacro %}
{# pill(text, kind) — kind ∈ bull|bear|warn|cyan|mag|purple|indigo|teal|lime|orange|rose|muted #}
{% macro pill(text, kind="muted", dot=false) -%}
{% if dot %}{% endif %}{{ text }}
{%- endmacro %}
{# tri(badge_list) — badge_list comes from web/coherence_badge.py:build_tri_badge.
Each item is (label, status) where status ∈ "ok"|"warn"|"missing". #}
{% macro tri(badge_list) -%}
{% if not badge_list %}—
{% else %}
{% for label, status in badge_list -%}
{{ label }}{% if status == "ok" %} ✓{% elif status == "warn" %} ⚠{% endif %}
{%- endfor %}
{% endif %}
{%- endmacro %}
{# icon(name) — inline Heroicons-shaped SVG. Matches stroke="currentColor" so they
inherit color via CSS. Add new icons below as needed. #}
{% macro icon(name, size=16) -%}
{% set s = size|string %}
{% if name == "search" %}
{% elif name == "calendar" %}
{% elif name == "arrow-right" %}
{% elif name == "plus" %}
{% elif name == "download" %}
{% elif name == "info" %}
{% else %}
{% endif %}
{%- endmacro %}
{# gloss(term, tip) — keyboard-accessible tooltip term. Wraps inline terms with
tabindex=0 so keyboard users can focus the term and reveal the tooltip. #}
{% macro gloss(term, tip) -%}
{{ term }}
{%- endmacro %}
{# popover(headline, anchor=None) — click-pinned trust popover.
Use as a {% call %} block. The body block becomes the popover body.
When `anchor` is supplied, a "Learn more →" link to /about# is appended.
IMPORTANT: do NOT call this inside a
tag. The macro renders block-level
elements (
and a
), which the HTML parser
auto-closes any enclosing
. Wrap in
or place as a sibling instead.
Body content convention:
…
followed by an
optional
.
See docs/superpowers/specs/2026-05-10-trust-popups-design.md for usage. #}
{% macro popover(headline, anchor=none) -%}
{% set uid = range(1, 100000000) | random %}