{% load powercrud %}
{% load powercrud_partials %}
<tr
    {% if row.row_id %}id="{{ row.row_id }}"{% endif %}
    class="text-center bg-base-200"
    data-inline-row="true"
    data-inline-active="true"
    {% if inline_cancel_url or row.inline_url %}
        data-inline-row-url="{{ inline_cancel_url|default:row.inline_url }}"
    {% endif %}
>
    {% if enable_selection_controls %}
    <td class="py-0 align-middle w-10 text-center"
        data-powercrud-selection-column="true">
        <input type="checkbox"
               class="checkbox checkbox-sm row-select-checkbox"
               data-id="{{ row.id }}"
               disabled>
    </td>
    {% endif %}
    {% if row_actions_column_position == "start" %}
        {% partial inline_actions_cell %}
    {% endif %}
    {% for cell in row.cells %}
    <td class="py-0 align-middle px-2 truncate table-column-width" data-field-name="{{ cell.name }}" data-powercrud-column-width-mode="{{ cell.width_mode }}">
        {% if cell.is_inline_editable and form %}
            {% with inline_field=form|get_form_field:cell.name %}
            {% if inline_field %}
                <label class="sr-only" for="{{ inline_field.id_for_label }}">{{ inline_field.label|default:cell.label }}</label>
                <div
                    class="inline-field-widget w-full{% if inline_field.errors %} pc-inline-field-error{% endif %}"
                    data-inline-field="{{ cell.name }}"
                    {% if inline_field.errors %}
                        data-inline-field-error="true"
                        data-inline-error-field="{{ cell.name }}"
                        data-inline-error-label="{{ inline_field.label|default:cell.label }}"
                        data-inline-error-message="{{ inline_field.errors|join:', ' }}"
                    {% endif %}
                    {% if cell.dependency %}
                        data-inline-dependent="true"
                        {% if cell.dependency.depends_on %}
                            data-inline-depends-on="{{ cell.dependency.depends_on|join:',' }}"
                        {% endif %}
                        data-inline-endpoint="{{ cell.dependency.endpoint_url|default:inline_config.dependency_endpoint_url }}"
                    {% endif %}
                >
                    {{ inline_field }}
                </div>
                {% if inline_field.errors %}
                <div id="{{ inline_field.auto_id }}_inline_error"
                     class="text-error text-xs mt-1"
                     data-inline-error-text="true">
                    {{ inline_field.errors|join:", " }}
                </div>
                {% endif %}
            {% else %}
                {{ cell.value }}
            {% endif %}
            {% endwith %}
        {% else %}
            <div class="text-sm text-base-content/70 truncate text-left">{{ cell.value }}</div>
        {% endif %}
    </td>
    {% endfor %}
    {% if row_actions_column_position != "start" %}
        {% partial inline_actions_cell %}
    {% endif %}
</tr>

{% partialdef inline_actions_cell %}
    <td class="pc-inline-actions-column pc-inline-actions-cell {% if row_actions_column_position == 'start' %}text-start{% else %}text-right{% endif %} py-1 align-middle"
        data-inline-actions="true"
        data-powercrud-row-actions-column="true"
        data-powercrud-row-actions-position="{% if row_actions_column_position == 'start' %}start{% else %}end{% endif %}"
        {% if row_actions_column_sticky %}data-powercrud-row-actions-sticky="true"{% endif %}>
        <input type="hidden" name="pk" value="{{ row.id }}">
        {% csrf_token %}
        {% for hidden_field in inline_hidden_fields %}
            {{ hidden_field.as_hidden }}
        {% endfor %}
        {% if form.non_field_errors %}
        <div class="alert alert-error shadow-sm mb-2 py-1 px-2 text-left text-sm">
            {{ form.non_field_errors|join:", " }}
        </div>
        {% endif %}
        <div class="pc-inline-actions-controls flex flex-nowrap items-center {% if row_actions_column_position == 'start' %}justify-start text-start{% else %}justify-end text-right{% endif %} gap-1">
            <button type="button"
                    class="btn {{ action_button_classes }} btn-primary btn-square"
                    aria-label="Save inline edit"
                    title="Save"
                    data-inline-save
                    hx-post="{{ inline_save_url|default:row.inline_url }}"
                    hx-target="#{{ row.row_id }}"
                    hx-swap="outerHTML"
                    hx-include="#{{ row.row_id }} [name]">
                <span class="sr-only">Save</span>
                <svg xmlns="http://www.w3.org/2000/svg"
                     fill="none"
                     viewBox="0 0 24 24"
                     stroke-width="2"
                     stroke="currentColor"
                     class="w-4 h-4"
                     aria-hidden="true">
                    <path stroke-linecap="round"
                          stroke-linejoin="round"
                          d="M4.5 12.75l6 6 9-13.5" />
                </svg>
            </button>
            <button type="button"
                    class="btn {{ action_button_classes }} btn-ghost btn-square"
                    aria-label="Cancel inline edit"
                    title="Cancel"
                    data-inline-cancel
                    hx-get="{{ inline_cancel_url|default:row.inline_url }}"
                    hx-target="#{{ row.row_id }}"
                    hx-swap="outerHTML"
                    hx-vals='{"inline_display": true}'
                    hx-trigger="click, keyup[key=='Escape'] from:closest tr"
                    >
                <span class="sr-only">Cancel</span>
                <svg xmlns="http://www.w3.org/2000/svg"
                     fill="none"
                     viewBox="0 0 24 24"
                     stroke-width="2"
                     stroke="currentColor"
                     class="w-4 h-4"
                     aria-hidden="true">
                    <path stroke-linecap="round"
                          stroke-linejoin="round"
                          d="M6 18L18 6M6 6l12 12" />
                </svg>
            </button>
        </div>
    </td>
{% endpartialdef inline_actions_cell %}