{% from "components/primitives/canonical_table.html" import canonical_table %}
{% set tb = block.toolbar %}
{% set has_toolbar = tb.search or tb.entries or tb.actions or tb.fields or tb.hidden or tb.column_toggles or tb.reset or tb.apply %}
{% call canonical_table(title=block.title, description=block.description, pagination=block.pagination, toolbar=tb if has_toolbar else none, form_action=block.form_action, locale=locale) %}
  {% if block.degraded_error %}
  <div class="card-body">
    <div class="alert alert-warning mb-0" role="alert">
      <p class="mb-0">{{ block.degraded_error }}</p>
    </div>
  </div>
  {% else %}
  <div class="table-responsive">
    <table class="table card-table table-vcenter{% if block.striped %} table-striped{% endif %}{% if block.nowrap %} table-nowrap{% endif %}{% if block.compact %} table-sm{% endif %}{% if block.selectable %} beeui-table-selectable{% endif %}{% if block.mobile %} table-mobile-{{ block.mobile }}{% endif %}">
      {% if block.columns %}
      <thead>
        <tr>
          {% if block.selectable %}<th class="w-1"><input type="checkbox" class="form-check-input beeui-table-select-all" disabled></th>{% endif %}
          {% for col in block.columns %}
          <th{% if col.sort_active %} aria-sort="{{ col.sort_direction }}"{% endif %}>
            {% if col.sortable and col.sort_href %}<a href="{{ col.sort_href }}" class="table-sort{% if col.sort_active and col.sort_direction == 'ascending' %} asc{% elif col.sort_active and col.sort_direction == 'descending' %} desc{% endif %}">{{ col.label }}</a>
            {% else %}{{ col.label }}{% endif %}
          </th>
          {% endfor %}
        </tr>
      </thead>
      <tbody>
        {% for row in block.rows %}
        <tr{% if block.selectable %} class="beeui-table-row-selectable"{% endif %}>
          {% if block.selectable %}<td><input type="checkbox" class="form-check-input beeui-table-row-checkbox" disabled></td>{% endif %}
          {% for col in block.columns %}
          <td{% if block.mobile %} data-label="{{ col.label }}"{% endif %}>
            {% set cell = row.get(col.key, {}) %}
            {% if cell.type == "text" %}
              {% if cell.tone %}<span class="text-secondary">{{ cell.value }}</span>{% else %}{{ cell.value }}{% endif %}
            {% elif cell.type == "link" %}
              {% if cell.href %}<a href="{{ cell.href }}">{{ cell.label }}</a>{% else %}<span class="text-secondary">{{ cell.label }}</span>{% endif %}
            {% elif cell.type == "badge" %}
              <span class="badge bg-{{ cell.tone if cell.tone else 'secondary' }}-lt">{{ cell.label }}</span>
            {% elif cell.type == "status" %}
              <span class="status status-{{ cell.status }}"><span class="status-dot status-dot-animated"></span>{{ cell.label }}</span>
            {% elif cell.type == "avatar_text" %}
              <div class="d-flex align-items-center">
                <span class="avatar avatar-sm{% if cell.color %} bg-{{ cell.color }}-lt{% endif %} me-2">{% if cell.initials %}{{ cell.initials }}{% else %}?{% endif %}</span>
                <div class="lh-sm"><div>{{ cell.title }}</div>{% if cell.subtitle %}<div class="text-secondary small">{{ cell.subtitle }}</div>{% endif %}</div>
              </div>
            {% elif cell.type == "progress" %}
              <div class="d-flex align-items-center gap-2">
                <svg class="flex-grow-1 text-{% if cell.color %}{{ cell.color }}{% else %}primary{% endif %}" viewBox="0 0 100 4" height="4" preserveAspectRatio="none" role="progressbar" aria-valuenow="{{ cell.value }}" aria-valuemin="0" aria-valuemax="100"><rect width="100" height="4" rx="2" fill="currentColor" opacity="0.15"></rect><rect width="{{ cell.value }}" height="4" rx="2" fill="currentColor"></rect></svg>
                <span class="text-secondary small">{{ cell.label }}</span>
              </div>
            {% elif cell.type == "actions" %}
              <div class="btn-list flex-nowrap">
              {% for action in cell.get("items", []) %}
                {% if action.href %}<a href="{{ action.href }}" class="btn btn-sm btn-ghost-primary">{{ action.label }}</a>{% else %}<span class="btn btn-sm btn-ghost-primary disabled">{{ action.label }}</span>{% endif %}
              {% endfor %}
              </div>
            {% else %}
              {{ cell.value if cell.value else ("н/д" if locale == 'ru' else "n/a") }}
            {% endif %}
          </td>
          {% endfor %}
        </tr>
        {% endfor %}
      </tbody>
      {% endif %}
    </table>
  </div>
  {% endif %}
{% endcall %}