<div class="api-info-wrapper">
  <h1>{{info.title}} <span class="api-info-version">({{info.version}})</span></h1>
  <p class="download-openapi" *ngIf="specUrl">
    Download OpenAPI specification:
    <a class="openapi-button" [attr.download]="downloadFilename" target="_blank" [attr.href]="specUrl"> Download </a>
  </p>
  <p>
    <!-- TODO: create separate components for contact and license ? -->
    <span *ngIf="info?.contact?.url || info?.contact?.email"> Contact:
      <a *ngIf="info.contact.url" href="{{info.contact.url}}">
        {{info.contact.name || info.contact.url}}</a>
      <a *ngIf="info.contact.email" href="mailto:{{info.contact.email}}">
        {{info.contact.email}}</a>
    </span>
    <span *ngIf="info.license"> License:
      <a *ngIf="info.license.url" href="{{info.license.url}}"> {{info.license.name}} </a>
      <span *ngIf="!info.license.url"> {{info.license.name}} </span>
    </span>
    <redoc-externalDocs [docs]="componentSchema.externalDocs"></redoc-externalDocs>
  </p>
  <span class="redoc-markdown-block">
    <dynamic-ng2-viewer  [html]="info['x-redoc-html-description']"></dynamic-ng2-viewer>
  </span>
</div>
