{# ---------- PAC-INFO MACROS ---------- #}
{# These macros render semantic HTML with light class hooks. #}

{%- macro key_value_table(pairs) -%}
  {# pairs: dict-like object #}
  <table class="lf-table lf-table--kv">
    <tbody>
      {%- for k, v in pairs.items() -%}
        {%- if k != "key" -%}
          <tr>
            <th class="lf-th lf-th--key">{{ k }}</th>
            <td class="lf-td lf-td--val">{{ v }}</td>
          </tr>
        {%- endif -%}
      {%- endfor -%}
    </tbody>
  </table>
{%- endmacro -%}


{%- macro category_block(category) -%}
  <div class="lf-section lf-section--category">
    <h5 class="lf-section__title">{{ category.__class__.__name__ }}</h5>
    {{ key_value_table(category.segments_as_dict()) }}
  </div>
{%- endmacro -%}


{# Renamed from service_table_section/services_table - neither name matched what
   they render (both emit <div>s, not <table>s), and the pairing read backwards
   (the "table" was the inner piece, the "section" wrapped it). #}
{%- macro service_links(services) %}
    <div class="lf-services">
    {%- for s in services -%}
        <a href="{{ with_ga_and_trace(s.url) }}" target="_blank" rel="noopener" class="lf-service"
           data-check-service-url="{{ check_service_url_for(s.url) }}">
            <img src="{{ resolve_static_image('external-link.svg')  }}" alt="" class="lf-service__icon">
            <span class="lf-service__name">{{ s.service_name }}</span>
        </a>
    {%- endfor -%}
    </div>
{%- endmacro -%}

{%- macro service_group_block(user_handover_group) -%}
<div class="lf-section lf-section--services">
    <div class="lf-origin-hint"> from {{ user_handover_group.origin }}</div>
    {{ service_links(user_handover_group.services)}}
</div>
{%- endmacro -%}


{%- macro reference(value, label=None, card_request_params=dict(), target_class=None, display_label=True) %}
    <div class="lf-ref-card-wrap"
        {% if pac_card_url_for is defined %}
        hx-get="{{ pac_card_url_for(pac_id=value, **card_request_params) }}"
        hx-trigger="load"
        hx-swap="innerHTML"
        hx-target="find .lf-ref-card"
        {% endif %}
        >

        {% if display_label %}
            {# The card above is the primary content; the label is always a real link
               too, on top of it - route_pac_id_url_for lets an issuer route it through
               their own page instead of linking straight to the PAC-ID's own URL. #}
            {% if route_pac_id_url_for is defined %}
            <a class="lf-reference" href="{{route_pac_id_url_for(pac_id=value)}}" target="_default">
                {{ label or value }}
            </a>
            {% else %}
            <a class="lf-reference" href="{{ value }}" target="_blank" rel="noopener">
                {{ label or value }}
            </a>
            {% endif %}
        {% endif %}


        {% if pac_card_url_for is defined %}
        <div class="{{target_class}} lf-ref-card">
            <!-- PAC info card gets injected here by HTMX -->
        </div>
        {% endif %}
    </div>
{%- endmacro %}


{%- macro attribute_row(a) -%}
  <tr>
    <th class="lf-th lf-th--label">
        {% if is_reference(a.key) %}
            {{ reference(a.key, a.label)}}
        {% elif is_url(a.key) %}
            <a href="{{a.key}}" target="_default"> {{ a.label }} </a>
        {% else %}
            {{ a.label }}
        {% endif %}
        <br>
        <span class="lf-th--key">{{a.key}}</span>
    </th>
    <td class="lf-td lf-td--val">
        {% for value in a.value_list%}
            {%- if is_image(value) -%}
                <figure class="lf-figure lf-figure--image">
                    <img src="{{ value|e }}" alt="{{ label|e }}" class="lf-attr-image">
                    <figcaption class="lf-figure__caption sr-only">{{ label }}</figcaption>
                </figure>
            {%- elif is_reference(value) -%}
                {# Checked before is_url - a PAC-ID is itself a valid URL, so a
                   bare (non-pyReference) PAC-ID string would otherwise always hit
                   the generic link branch below and never reach the card. #}
                {{ reference(value)}}
            {%- elif is_url(value) -%}
                {# Same icon+label format as service_links' <a> elements -
                   reuses its classes rather than a parallel set, since the look is
                   meant to be identical. #}
                <a href="{{ value|e }}" target="_blank" rel="noopener" class="lf-service">
                    <img src="{{ resolve_static_image('external-link.svg') }}" alt="" class="lf-service__icon">
                    <span class="lf-service__name">{{ value }}</span>
                </a>
            {%- else -%}
                <span class="lf-text">{{ render_text(value) }}</span>
            {%- endif -%}
            {% if not loop.last %}<br>{% endif %}
        {% endfor%}
    </td>
  </tr>
{%- endmacro -%}


{%- macro attribute_group_block(ag) -%}
  <div class="lf-section lf-section--attributes">
    <h5 class="lf-section__title">
      {{ ag.label }} <span class="lf-origin-hint">(from {{ ag.origin }})</span>
    </h5>
    <table class="lf-table lf-table--kv">
      <tbody>
        {%- for a in ag.attributes.values() -%}
          {{ attribute_row(a) }}
        {%- endfor -%}
      </tbody>
    </table>
</div>
{%- endmacro -%}



{%- macro data_table_inline(dt) -%}
  {# Renders your DataTable structure; expects filters: is_data_table(dt) #}
  {%- if dt.data | length == 1 -%}
    <table class="lf-table lf-table--kv">
      <tbody>
        {%- for i in range(dt.col_names | length) -%}
          <tr>
            <th class="lf-th ">{{ dt.col_names[i] }}</th>
            <td class="lf-td ">{{ dt.data[0][i] }}</td>
          </tr>
        {%- endfor -%}
      </tbody>
    </table>
  {%- else -%}
    <table class="lf-table lf-table--grid">
      <thead>
        <tr>
          {%- for rn in dt.col_names -%}
            <th class="lf-th">{{ rn }}</th>
          {%- endfor -%}
        </tr>
      </thead>
      <tbody>
        {%- for row in dt.data -%}
          <tr>
            {%- for e in row -%}
              <td class="lf-td">{{ e }}</td>
            {%- endfor -%}
          </tr>
        {%- endfor -%}
      </tbody>
    </table>
  {%- endif -%}
{%- endmacro -%}


{%- macro attached_data_block(attached_data) -%}
  <div class="lf-section lf-section--attached">
    {%- for name, trex in attached_data.items() -%}
        {{ attached_data_trex(name, trex) }}
    {%- endfor -%}
    </div>
{%- endmacro -%}

{# One pictogram <img>, preferring an explicitly-supplied image over the
   code-derived guess (see explicit_pictogram_images/hazard_pictogram_codes in
   lib/render_predicates.py). resolve_static_image() only searches flat filenames
   directly in the static root (Path(base_name).stem strips any directory
   component before it even searches) - no subdirectory, no extension needed, it
   tries svg/png/jpg/jpeg/webp itself. #}
{%- macro pictogram_image(code, explicit_images=dict()) -%}
  {%- if code in explicit_images -%}
    <img src="{{ explicit_images[code] }}" alt="{{ pictogram_name(code) }}" class="lf-ghs-pictogram">
  {%- else -%}
    <img src="{{ resolve_static_image(code.lower()) }}" alt="{{ pictogram_name(code) }}" class="lf-ghs-pictogram">
  {%- endif -%}
{%- endmacro -%}


{# Shown once above the hazard/precautionary statement table (see
   hazard_pictogram_codes) rather than repeated per row - a hazard statement's
   pictogram is a property of the substance as a whole, and several codes
   commonly share the same one (e.g. H300/H310/H330 are all Skull-and-crossbones). #}
{%- macro pictogram_strip(codes, explicit_images=dict()) -%}
  {%- if codes -%}
    <div class="lf-ghs-pictogram-strip">
      {%- for code in codes -%}
        {{ pictogram_image(code, explicit_images) }}
      {%- endfor -%}
    </div>
  {%- endif -%}
{%- endmacro -%}


{# GHS hazard/precautionary statement rows - code beside its full text, resolved
   from labfreed/utilities/ghs/ghs_statements.json (UNECE GHS Rev.7 Annex 3)
   rather than requiring the attribute value to carry the full text itself. Falls
   back to showing the raw value if the code isn't in that table (e.g. an
   EU-specific EUH code, which isn't part of the UN GHS document this was sourced
   from) - see developer-docs/design-choices.md. #}
{# th/td classes match every other key/value table (key_value_table, attribute_row) -
   same 1/3-2/3 column widths and label bolding from .lf-table--kv, for free, no
   GHS-specific CSS needed. #}
{%- macro hazard_statement_row(raw_value) -%}
  {%- set code = extract_statement_code(raw_value) -%}
  <tr class="lf-ghs-row">
    <th class="lf-th lf-th--label">{{ code }}</th>
    <td class="lf-td lf-td--val">{{ hazard_statement_text(code) or raw_value }}</td>
  </tr>
{%- endmacro -%}


{%- macro precautionary_statement_row(raw_value) -%}
  {%- set code = extract_statement_code(raw_value) -%}
  <tr class="lf-ghs-row">
    <th class="lf-th lf-th--label">{{ code }}</th>
    <td class="lf-td lf-td--val">{{ precautionary_statement_text(code) or raw_value }}</td>
  </tr>
{%- endmacro -%}


{%- macro attached_data_trex(name, trex) %}
    <div class="lf-subsection">
        <h5 class="lf-subsection__title">{{ name }}</h5>
        <table class="lf-table lf-table--kv">
        <tbody>
            {%- for k, v in trex.items() -%}
            <tr>
                <th class="lf-td lf-td--val">{{ k }} </th>
                <td class="lf-td lf-td--val">
                {%- if is_data_table(v) -%}
                    {{ data_table_inline(v) }}
                {%- else -%}
                    {{ v }}
                {%- endif -%}
                </td>
            </tr>
            {%- endfor -%}
        </tbody>
        </table>
    </div>
{% endmacro %}