webprofiler-10.0.x-dev/templates/Profiler/components.html.twig

{% for name,component in components %}
  <div class="webprofiler__card_large">
    <div class="webprofiler__card__title">{{ name }}</div>
    <div class="webprofiler__card_content">
      <div><b>{{ 'Status'|t }}</b>: {{ component.status }}</div>
      <div><b>{{ 'Path'|t }}</b>: {{ component.path }}</div>
      <div><b>{{ 'Documentation'|t }}</b>: <pre style="height: 200px;overflow: scroll;border: 1px solid #ccc;">{{ component.documentation|raw }}</pre></div>
      <div><b>{{ 'Group'|t }}</b>: {{ component.group }}</div>
      <div><b>{{ 'Thumbnail'|t }}</b>: {{ component.thumbnail|default('none'|t) }}</div>
      <div><b>{{ 'Provider'|t }}</b>: {{ component.provider }}</div>
      <div>
        <b>{{ 'Props'|t }}</b>:
        {% if component.props.properties|length %}
          <ul>
            {% for prop_name,prop in component.props.properties %}
              <li>{{ prop_name }}</li>
            {% endfor %}
          </ul>
        {% else %}
          {{ 'none'|t }}
        {% endif %}
      </div>
      <div>
        <b>{{ 'Slots'|t }}</b>:
        {% if component.slots|length %}
          <ul>
            {% for slot_name,slot in component.slots %}
              <li>{{ slot_name }}: {{ slot.title }}</li>
            {% endfor %}
          </ul>
        {% else %}
          {{ 'none'|t }}
        {% endif %}
      </div>
      <div>
        <b> {{ 'Assets'|t }}</b>:
        {% if component.library %}
          <ul>
            {% for css in component.library.css %}
              {% for css_group,css_data in css %}
                <li>{{ css_group }}</li>
              {% endfor %}
            {% endfor %}
            {% for js_name,js in component.library.js %}
              <li>{{ js_name }}</li>
            {% endfor %}
          </ul>
        {% else %}
          {{ 'none'|t }}
        {% endif %}
      </div>
    </div>
  </div>
{% endfor %}