{{!-- template-lint-disable no-invalid-interactive  --}}

<header class="site-header">
  {{#if @betaNotice}}
    <a href="https://planninglabs.nyc/" class="labs-beta-notice hide-for-print">A beta project of NYC Planning Labs</a>
  {{else}}
    {{yield (hash pre=(component "labs-ui/site-header-pre"))}}
  {{/if}}

  <div class="grid-x grid-padding-x">

    <div {{action (mut this.closed) true preventDefault=false}} class="branding cell {{if @responsiveNav (concat @responsiveSize "-auto shrink") "auto"}}">
      <a class="dcp-link" href="http://www1.nyc.gov/site/planning/index.page"><img class="dcp-logo" src="{{rootURL}}/labs-ui/dcp_logo_772.png" alt="NYC Planning"></a>
      {{yield (hash title=(component "labs-ui/site-header-title"))}}
    </div>

    {{#if @responsiveNav}}
      <div class="cell auto hide-for-{{@responsiveSize}} text-right">
        <button class="responsive-nav-toggler hide-for-print" type="button" {{action (mut this.closed) (not this.closed)}}>Menu</button>
      </div>
    {{/if}}

    <nav {{action (mut this.closed) (not this.closed) preventDefault=false}} role="navigation" class="cell {{if @responsiveNav (concat @responsiveSize "-shrink responsive") "shrink"}} {{if (and @responsiveNav this.closed) (concat "show-for-" @responsiveSize)}} hide-for-print">
      {{yield (hash nav=(component "labs-ui/site-header-nav"))}}
    </nav>

  </div>
</header>