# HeaderSlotProps

> _Since v1.9.0_

Slot context for `#header` slot in TbwGridColumn. Gives the consumer
full control over the header cell label — sort icons and filter
buttons are NOT added automatically; use the `renderSortIcon` and
`renderFilterButton` helpers to opt in. Resize handles are appended
automatically by the grid for resizable columns.

#### Example

```vue
<TbwGridColumn field="status" sortable>
  <template #header="{ value, sortState, renderSortIcon }">
    <div class="custom-header">
      <span>{{ value }}</span>
      <component :is="renderSortIcon()" v-if="sortState" />
    </div>
  </template>
</TbwGridColumn>
```

## Properties

| Property | Type | Description |
| -------- | ---- | ----------- |
| `column` | <code><a href="/grid/vue/api/types/columnconfig/">ColumnConfig</a>&lt;TRow&gt;</code> | Column configuration reference. |
| `value` | <code>string</code> | The header text (from `column.header` or `column.field`). |
| `sortState` | <code>desc &#124; asc &#124; unknown</code> | Current sort state for this column. |
| `filterActive` | <code>boolean</code> | Whether the column has an active filter. |
| `cellEl` | <code>HTMLElement</code> | The header cell DOM element being rendered into. |
| `renderSortIcon` | <code>() =&gt; HTMLElement &#124; unknown</code> | Render the standard sort indicator icon. Returns null if not sortable. |
| `renderFilterButton` | <code>() =&gt; HTMLElement &#124; unknown</code> | Render the standard filter button. Returns null if filtering is not active for this column. |