{{{customeditframe.editframeStart}}}
<div class="navigation-search-panel js-search-panel">
    <a href="#" class="navigation-search-panel__close-button js-close-search-panel"></a>
    <div class="grid-container">
        {{#if searchBar}}
        <div class="grid-x grid-padding-x">
            <div class="cell medium-8 medium-offset-2">
                <h2 class="navigation-search-panel__title">{{{searchBar.title}}}</h2>
                <form class="navigation-search-panel__form" action="{{searchBar.searchPageUrl}}" method="GET">
                    <label for="navigation-search-bar" class="navigation-search-panel__search-label">{{{searchBar.title}}}</label>
                    <input type="text" name="search-term" id="navigation" class="navigation-search-panel__search-term" placeholder="{{searchBar.placeholderText}}" />
                    <button class="button-p1 button-p1--icon-only navigation-search-panel__search-button" />
                </form>
            </div>
        </div>
        {{/if}}
        {{#if suggestionLinks}}
        <div class="grid-x grid-padding-x">
            <div class="cell medium-8 medium-offset-2">
                <h2 class="navigation-search-panel__suggestions-title">{{{suggestionsTitle}}}</h2>
                <div class="grid-x navigation-search-panel__suggestions">
                    {{#each suggestionLinks}}
                    {{{customeditframe.editframeStart}}}
                    <div class="cell medium-4">
                        <a href="{{url}}" class="navigation-search-panel__suggestion-link">{{{text}}}</a>
                    </div>
                    {{{customeditframe.editframeStop}}}
                    {{/each}}
                </div>
            </div>
        </div>
        {{/if}}
        {{#if cards.length}}
        <div class="grid-x grid-padding-x">
            <div class="cell">
                <h2 class="navigation-search-panel__cards-title">{{{cardsTitle}}}</h2>
            </div>
        </div>
        <div class="grid-x grid-padding-x">
            {{#each cards}}
            <div class="cell small-6 medium-3 navigation-search-panel__card-container">
                {{> @cp-card-standard hideTeaser=true }}
            </div>
            {{/each}}
        </div>
        {{/if}}
    </div>
</div>
{{{customeditframe.editframeStop}}}