{% from "admin/components/ui/combobox.html" import combobox %}
{% from "admin/components/ui/switch.html" import switch_control %}
{# Form/FormItem, ported from shadcn/ui: every branch below renders the
   same label + control + description + error unit, with the wrapper
   classes from ui('field', ...) so a custom field lines up with the
   generated ones for free.

   Controls that must survive a JS-free POST stay native elements styled
   to match shadcn -- checkbox and <input type="date"> -- rather than
   shadcn's Radix-backed versions. The Alpine-driven ports are the
   relation combobox and the calendar popover.

   `with context` so the combobox branch can read `base_path` for its
   /lookup URL without every call site passing it through. #}
{% from "admin/components/icons.html" import icon %}
{% from "admin/components/ui/calendar.html" import date_picker %}
{% from "admin/components/ui/select.html" import select %}
{% from "admin/components/ui/multi-select.html" import multi_select %}
{# `key` keeps a control's element ids unique when the same field renders
   more than once on a page, as it does in every row of an inline. #}
{% macro render_form_input(field, value, errors, relation=none, readonly_field=false, key="") %}
{% set input_types = {
  "integer": "number",
  "decimal": "number",
  "email": "email",
  "url": "url",
  "image": "url",
  "datetime": "datetime-local",
  "password": "password",
} %}
{# A boolean renders as a switch on the same row as its name: a toggle
   reads as a setting, and a setting's name belongs beside it. Every
   other type keeps the label-above-control layout. #}
{% set inline = field.field_type == "boolean" and not readonly_field %}
<div class="{{ ui('field') }}{% if inline %} {{ ui('field', 'row') }}{% endif %}">
  {# Inline: the control comes first in source order, so the switch sits
     to the left of the name it belongs to. #}
  {% if inline %}
  <div class="shrink-0">{{ switch_control(field.name, "field-" ~ field.name, value, field.disabled) }}</div>
  {% endif %}
  <span class="{% if inline %}{{ ui('field', 'row-text') }}{% else %}contents{% endif %}">
  <label for="field-{{ field.name }}" class="{{ ui('field', 'label') }}{% if inline %} {{ ui('field', 'row-label') }}{% endif %}">
    {{ _(field.label) }}{% if field.required %}<span class="{{ ui('field', 'required') }}" aria-hidden="true">*</span>{% endif %}
  </label>
  {% if inline %}
  {% if field.help_text %}<p class="{{ ui('field', 'description') }}">{{ _(field.help_text) }}</p>{% endif %}
  {% for error in errors or [] %}<p class="{{ ui('field', 'message') }}">{{ error }}</p>{% endfor %}
  {% endif %}
  </span>
  {% if not inline %}
  <div class="{{ ui('field', 'control') }}">
  {# Read-only wins over every type branch below: no control, and
     nothing posted. The handler refuses the name too -- omitting the
     input here is presentation, not protection. #}
  {% if readonly_field %}
  {% set shown = value|form_value(field.field_type) %}
  <p class="{{ ui('field', 'readonly') }}">{{ shown if shown else "&mdash;" | safe }}</p>
  {% elif field.field_type == "text" %}
  <textarea id="field-{{ field.name }}" name="{{ field.name }}" placeholder="{{ _(field.placeholder) }}" autocomplete="off"
            {% if field.required %}required{% endif %}
            {% if field.readonly %}readonly{% endif %}
            {% if field.disabled %}disabled{% endif %}
            class="{{ ui('textarea') }}">{{ value or "" }}</textarea>

  {% elif field.field_type == "date" %}
  {# DatePicker: a native date input (which already posts YYYY-MM-DD
     with no JS and gets the platform picker on mobile) plus the shadcn
     Calendar port in a popover beside it. See components/ui/calendar.html. #}
  {{ date_picker(field.name, value|form_value(field.field_type), field.required, field.disabled) }}
  {% elif field.field_type == "enum" %}
  {% set enum_options = namespace(pairs=[]) %}
  {% for choice in field.choices %}{% set enum_options.pairs = enum_options.pairs + [(choice, choice)] %}{% endfor %}
  {{ select(field.name, enum_options.pairs, selected=value, placeholder=_("Select…"), disabled=field.disabled) }}
  {% elif field.field_type in ("foreignkey", "onetoone") and relation and relation.autocomplete %}
  {{ combobox(name=field.name,
              id="combobox-results-" ~ (key ~ "-" if key else "") ~ field.name,
              selected_pk=relation.selected_pk,
              selected_label=relation.selected_label,
              lookup_url=base_path ~ "/" ~ relation.lookup_target ~ "/lookup",
              placeholder=_('Search…'),
              disabled=field.disabled) }}

  {% elif field.field_type in ("foreignkey", "onetoone") %}
  {{ select(field.name, relation.options if relation else [],
            selected=(relation.selected_pk if relation else none), placeholder="—", disabled=field.disabled) }}
  {% elif field.field_type == "manytomany" %}
  {% set m2m_options = namespace(pairs=[]) %}
  {% for pk, label in (relation.options if relation else []) %}
  {% set m2m_options.pairs = m2m_options.pairs + [(pk, label, relation and pk in relation.selected_pks)] %}
  {% endfor %}
  {{ multi_select(field.name, m2m_options.pairs, placeholder=_("Select…"), disabled=field.disabled) }}
  {% else %}
  <input type="{{ input_types.get(field.field_type, 'text') }}" id="field-{{ field.name }}" name="{{ field.name }}"
         value="{{ value|form_value(field.field_type) }}" placeholder="{{ _(field.placeholder) }}" autocomplete="off"
         {% if field.required %}required{% endif %}
         {% if field.readonly %}readonly{% endif %}
         {% if field.disabled %}disabled{% endif %}
         class="{{ ui('input') }}">
  {% endif %}
  </div>
  {% endif %}
  {% if not inline %}
  {% if field.help_text %}
  <p class="{{ ui('field', 'description') }}">{{ _(field.help_text) }}</p>
  {% endif %}
  {% for error in errors or [] %}
  <p class="{{ ui('field', 'message') }}">{{ error }}</p>
  {% endfor %}
  {% endif %}
</div>
{% endmacro %}