<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers" data-namespace-typo3-fluid="true">
<f:for each="{nav}" as="navItem">
    <v:variable.set name="html_class"><v:format.sanitizeString>{f:if(condition: 'navItem.data.html_class', then: navItem.data.html_class, else: navItem.link)}</v:format.sanitizeString></v:variable.set>
    <f:spaceless>
        <li class="nav-item nav-item--{html_class}{f:if(condition: navItem.active, then: ' active')}{f:if(condition: navItem.current, then: ' current')}{f:if(condition: navItem.children, then: ' parent')} ">
            <f:if condition="{navItem.children}">
                <f:then>
                    <a class="nav-link nav-toggler collapsed" href="{navItem.link}" id="toggler-{html_class}" data-toggle="collapse" data-target="#collapse-{html_class}, .show" aria-expanded="false">{navItem.title -> f:format.htmlentitiesDecode()}</a>
                    <f:render section="submenu" arguments="{submenu: navItem.children, dropdownToggler:html_class}"/>
                </f:then>
                <f:else>
                    <a class="nav-link" href="{navItem.link}" role="menuitem">{navItem.title -> f:format.htmlentitiesDecode()}</a>
                </f:else>
            </f:if>
        </li>
    </f:spaceless>
</f:for>
<f:section name="submenu">
    <div class="sub-nav-panel collapse" id="collapse-{dropdownToggler}" aria-labelledby="toggler-{dropdownToggler}">
        <ul class="sub-nav">
            <f:for each="{submenu}" as="subItem">
                <li class="sub-item sub-item--{v:format.sanitizeString(string: subItem.data.uid)}{f:if(condition: subItem.active, then: ' active')}{f:if(condition: subItem.current, then: ' current')}{f:if(condition: subItem.children, then: ' parent')} ">
                    <a class="nav-link" href="{subItem.link}" title="{f:if(condition: subItem.data.abstract, then: subItem.data.abstract, else: subItem.data.description)}" data-uid="{subItem.data.uid}" role="menuitem">{subItem.title-> f:format.htmlentitiesDecode()}</a>

                </li>
            </f:for>
        </ul>
    </div>
</f:section>
