<html
    xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
    xmlns:core="http://typo3.org/ns/TYPO3/CMS/Core/ViewHelpers"
    data-namespace-typo3-fluid="true">

<div class="t3js-upgrade-doc panel panel-rst panel-{fileArray.class} risk-medium" data-item-tags="{fileArray.tagList}" data-item-version="{fileArray.version}" data-item-state="{state}" id="heading{id}">
    <h2 class="panel-heading" role="tab">
        <div class="panel-heading-row">
            <button
                class="panel-button order-2 collapsed"
                type="button"
                data-bs-target="#collapse{id}"
                data-bs-toggle="collapse"
                aria-expanded="false"
                aria-controls="collapse{id}"
            >
                <div class="panel-title"><strong>{fileArray.headline}</strong></div>
                <span class="caret"></span>
            </button>
            <f:if condition="{read}">
                <f:then>
                    <button type="button" class="btn btn-link t3js-upgradeDocs-unmarkRead" data-filepath="{fileArray.filepath}" title="Mark as not read">
                        <core:icon identifier="actions-ban" size="small" />
                        <span class="visually-hidden">restore this document</span>
                    </button>
                </f:then>
                <f:else>
                    <button type="button" class="btn btn-link t3js-upgradeDocs-markRead" data-filepath="{fileArray.filepath}" title="Mark as read">
                        <core:icon identifier="actions-check" size="small" />
                        <span class="visually-hidden">ignore this document</span>
                    </button>
                </f:else>
            </f:if>
        </div>
    </h2>
    <div id="collapse{id}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading{id}">
        <div class="rst-tags">
            <f:for each="{fileArray.tags}" as="tag">
                <span class="badge">{tag}</span>
            </f:for>
        </div>
        <div class="rst-links">
            <f:if condition="{fileArray.url.issue}">
                <a href="{fileArray.url.issue}" target="_blank" rel="noreferrer" class="nowrap"><core:icon identifier="actions-window-open" /> Open issue</a>
            </f:if>
            <f:if condition="{fileArray.url.documentation}">
                <a href="{fileArray.url.documentation}" target="_blank" rel="noreferrer" class="nowrap"><core:icon identifier="actions-window-open" /> Open rendered version</a>
            </f:if>
        </div>
        <pre class="panel-body"><f:format.raw>{fileArray.parsedContent}</f:format.raw></pre>
    </div>
</div>

</html>
