import { html } from '//resources/polymer/v3_0/polymer/polymer_bundled.min.js';
export function getTemplate() {
    return html `<!--_html_template_start_--><style include="shared-style">
  /* General toolbar layout. */
  cr-toolbar {
    min-height: 56px;
    --cr-toolbar-center-basis: var(--password-manager-main-basis);
    --cr-toolbar-header-white-space: nowrap;
  }

  cr-toolbar:not([narrow]) {
    --cr-toolbar-left-spacer-width: var(--side-bar-width);
  }

  #product-logo {
    height: 24px;
    margin-inline-end: 16px;
    margin-top: 6px;
    width: 24px;
  }
</style>
<cr-toolbar id="mainToolbar" on-keydown="onKeyDown_"
    page-name="[[pageName]]" clear-label="$i18n{clearSearch}"
    search-prompt="$i18n{searchPrompt}" menu-label="$i18n{menuButtonLabel}"
    autofocus on-search-changed="onSearchChanged_"
    role="banner" show-menu="[[narrow]]" narrow="[[narrow]]"
    narrow-threshold="1300">
  <picture slot="product-logo">
    <img id="product-logo"
        srcset="chrome://password-manager/images/password_manager_logo.svg"
        role="presentation">
  </picture>
  <cr-icon-button id="helpButton" iron-icon="cr:help-outline"
      title="$i18n{help}" on-click="onHelpClick_" suppress-rtl-flip>
  </cr-icon-button>
</cr-toolbar>
<!--_html_template_end_-->`;
}
