{# Small shared parts. #}

{% macro empty(text) %}<div class="empty">{{ text }}</div>{% endmacro %}

{# The hidden field every form that changes something carries. #}
{% macro csrf_field() %}<input type="hidden" name="csrf_token" value="{{ csrf }}" />{% endmacro %}

{# A form that is only a button, e.g. "Delete", with a question before it. #}
{% macro action(url, label, confirm=None, cls="small", fields={}) %}
<form class="inline" method="post" action="{{ url }}"{% if confirm %} data-confirm="{{ confirm }}"{% endif %}>
  {{ csrf_field() }}
  {% for name, value in fields.items() %}<input type="hidden" name="{{ name }}" value="{{ value }}" />{% endfor %}
  <button class="{{ cls }}" type="submit">{{ label }}</button>
</form>
{% endmacro %}

{# A labelled input. #}
{% macro field(name, label, value="", type="text", hint=None, required=False, cls="", attrs="") %}
<div class="field {{ cls }}">
  <label for="f-{{ name }}">{{ label }}</label>
  <input id="f-{{ name }}" name="{{ name }}" type="{{ type }}" value="{{ value }}"{% if required %} required{% endif %} {{ attrs }} />
  {% if hint %}<span class="hint">{{ hint }}</span>{% endif %}
</div>
{% endmacro %}

{# The links below a list: to the next page, and from a later page back to
   the first. ``pages``: (more, first), as ``page_links`` gives them. #}
{% macro pager(pages) %}
{% set more, first = pages %}
{% if more or first %}
<div class="body toolbar">
  {% if first %}<a class="btn small" href="{{ first }}">Newest</a>{% endif %}
  <span class="grow"></span>
  {% if more %}<a class="btn small" href="{{ more }}">Older</a>{% endif %}
</div>
{% endif %}
{% endmacro %}

{# The options of a folder select: the tree indented by depth, without the
   folders in ``exclude``. #}
{% macro folder_options(tree, exclude, selected=None) %}
{% for folder, depth in tree %}{% if folder.id not in exclude %}<option value="{{ folder.id }}"{% if folder.id == selected %} selected{% endif %}>{{ "· " * depth }}{{ folder.name }}</option>{% endif %}{% endfor %}
{% endmacro %}

{# The tag beside an account whose user may read mail there and send it
   to any address: what an injected instruction needs to carry data out. #}
{% macro anywhere_tag() %}<span class="tag warn" title="This user may read mail here and send it to any address. A mail with injected instructions could use that to carry data out. Narrow sending with a grant's recipients.">reads and sends anywhere</span>{% endmacro %}

{# The stored credentials of an account, one per line. #}
{% macro credentials(stored) %}{% for credential in stored %}{{ credential.field }}, changed {{ credential.updated_at | when }}{% if not loop.last %}<br />{% endif %}{% else %}—{% endfor %}{% endmacro %}

{# The card at the end of a page whose one button removes the thing. #}
{% macro danger_card(title, text, url, label, confirm) %}
<section class="card">
  <header><h2>{{ title }}</h2></header>
  <div class="body toolbar">
    <span class="muted grow">{{ text }}</span>
    {{ action(url, label, confirm=confirm, cls="danger") }}
  </div>
</section>
{% endmacro %}

{# A native dialog for a form loaded into #modal. #}
{% macro modal(title) %}
<dialog class="modal">
  <header>
    <h2>{{ title }}</h2>
    <button class="ghost small" type="button" data-close aria-label="Close">✕</button>
  </header>
  <div class="body">{{ caller() }}</div>
</dialog>
{% endmacro %}