{# Bar track region — v0.61.53 (#893).

   Compact horizontal value bars: per-row label + filled track + value.
   One row per bucket; bucket comes from the standard `group_by` +
   `aggregates` single-dim chart pipeline (same data shape as
   bar_chart). Differences from bar_chart:

   - Horizontal track (vs vertical bar)
   - Value pre-formatted server-side via `track_format` Python format
     spec (so author intent like `"{:.0%}"` works without Jinja
     filter gymnastics)
   - Fill computed from `value / track_max` (or auto-max when
     `track_max:` is omitted)

   Card safety: region emits zero chrome + zero title. The dashboard
   slot owns both via region_card.

   v0.62 CSS refactor: inline Tailwind → semantic .dz-bar-track-*
   classes (components/regions.css). #}
{% from 'macros/region_wrapper.html' import region_card %}
{% call region_card(title) %}
<div class="dz-bar-track-region">
  {% if bar_track_rows and bar_track_rows | length > 0 %}
    <div class="dz-bar-track-rows">
      {% for row in bar_track_rows %}
        <div class="dz-bar-track-row">
          <span class="dz-bar-track-label" title="{{ row.label }}">{{ row.label }}</span>
          <div class="dz-bar-track"
               role="progressbar"
               aria-valuemin="0"
               aria-valuemax="{{ bar_track_max }}"
               aria-valuenow="{{ row.value }}"
               aria-label="{{ row.label }}: {{ row.formatted_value }}">
            <span class="dz-bar-track-fill"
                  style="width: {{ row.fill_pct | round(2) }}%;"
                  title="{{ row.label }}: {{ row.formatted_value }}"></span>
          </div>
          <span class="dz-bar-track-value">{{ row.formatted_value }}</span>
        </div>
      {% endfor %}
    </div>
    <p class="dz-bar-track-summary">
      {{ bar_track_rows | length }} rows · scale 0–{{ bar_track_max | round(2) }}
    </p>
  {% else %}
    <p class="dz-empty-dense" role="status">{{ empty_message | default("No data available.") }}</p>
  {% endif %}
</div>
{% endcall %}