# GridHeaderContent

> _Since v1.7.0_

Declarative wrapper around the grid's imperative
ShellPlugin.registerHeaderContent API.

Captures an `<ng-template>` and mounts it as an Angular embedded view into
the slot the grid provides for header content. Must be a child of
`<tbw-grid>`.

## Usage

```html
<tbw-grid [rows]="rows" [gridConfig]="config">
  <tbw-grid-header-content id="calendar-nav" [order]="0">
    <ng-template let-grid>
      <app-header-nav [year]="year()" (yearChange)="setYear($event)" />
    </ng-template>
  </tbw-grid-header-content>
</tbw-grid>
```

## Properties

| Property | Type | Description |
| -------- | ---- | ----------- |
| `id` | <code>InputSignal&lt;string &#124; undefined&gt;</code> | Unique identifier for this header content entry. Optional — defaults to a stable generated id. |
| `order` | <code>InputSignal&lt;number&gt;</code> | Render order priority. Lower values appear first. |
| `template` | <code>Signal&lt;TemplateRef&lt;any&gt; &#124; undefined&gt;</code> | The template to mount into the grid's header content slot. |

### Property Details

#### order

**Default:** `100`

---

## Methods

### ngTemplateContextGuard()

Type guard for template context inference.

```ts
ngTemplateContextGuard(_dir: GridHeaderContent, ctx: unknown): ctx
```

#### Parameters

| Name | Type | Description |
| ---- | ---- | ----------- |
| `_dir` | <code><a href="/grid/angular/api/directives/gridheadercontent/">GridHeaderContent</a></code> |  |
| `ctx` | <code>unknown</code> |  |

***