<template name="dropdownForm">
    {{#form (extend this mixins='dropdown' class='dropdown' hideValidationBox=true)}}
        {{>dropdownFormMenu items=this.items classes=this.options.menuClasses}}
    {{/form}}
</template>

<template name="dropdownFormMenu">
    <ul class="dropdown-menu {{this.classes}}">
        {{#if UI.contentBlock}}
            {{>UI.contentBlock}}
        {{else}}
            {{#each item in this.items}}
                {{#if isVisible item}}
                    {{#if item.separatorBefore}}
                        <li role="separator" class="divider"></li>
                    {{/if}}
                    <li class="{{#if item.disabled}}disabled{{/if}} {{#if item.items}}dropdown-submenu{{/if}}">
                        {{#link item}}
                            {{#if item.icon}}
                                <i class="{{item.icon}} {{item.iconClasses}}"></i>
                            {{/if}}
                            {{#if item.iconSvgUse}}
                                <svg class="{{item.iconClasses}}">
                                    <use xlink:href={{absoluteUrl item.iconSvgUse}}></use>
                                </svg>
                            {{/if}}
                            {{#let text=(getText item)}}
                                {{#if text}}
                                    <span>{{text}}</span>
                                {{/if}}
                            {{/let}}
                        {{/link}}
                    </li>
                    {{#if item.separatorAfter}}
                        <li role="separator" class="divider"></li>
                    {{/if}}
                {{/if}}
            {{/each}}
        {{/if}}
    </ul>
</template>
