github.com/GoogleCloudPlatform/testgrid@v0.0.174/web/src/testgrid-grid-header-row.ts (about)

     1  import { LitElement, html, css } from 'lit';
     2  import { map } from 'lit/directives/map.js';
     3  import { customElement, property } from 'lit/decorators.js';
     4  import { ListHeadersResponse } from './gen/pb/api/v1/data.js';
     5  import './testgrid-grid-row-name';
     6  import './testgrid-grid-column-header';
     7  
     8  @customElement('testgrid-grid-header-row')
     9  export class TestgridGridHeaderRow extends LitElement {
    10    static styles = css`
    11      :host {
    12        text-align: center;
    13        font-family: Roboto, Verdana, sans-serif;
    14        display: flex;
    15        flex-flow: row nowrap;
    16        gap: 0px 2px;
    17        margin: 2px;
    18      }
    19    `;
    20  
    21    @property() headers: ListHeadersResponse;
    22  
    23    render() {
    24      // TODO(michelle192837): Replace row name component with more appropriate one.
    25      return html`
    26        <testgrid-grid-row-name></testgrid-grid-row-name>
    27        ${map(
    28          this.headers?.headers,
    29          header =>
    30            html`<testgrid-grid-column-header
    31              .name="${header.build}"
    32            ></testgrid-grid-column-header>`
    33        )}
    34      `;
    35    }
    36  }