# TypeDefault

> _Since v0.3.0_

Type default configuration for Vue applications.

Defines default renderer, editor, and editorParams for a data type
using Vue render functions.

#### Example

```ts
import type { TypeDefault } from '@toolbox-web/grid-vue';
import CountryFlag from './CountryFlag.vue';
import CountrySelect from './CountrySelect.vue';

const countryDefault: TypeDefault<Employee, string> = {
  renderer: (ctx) => h(CountryFlag, { code: ctx.value }),
  editor: (ctx) => h(CountrySelect, {
    modelValue: ctx.value,
    'onUpdate:modelValue': ctx.commit,
  }),
};
```

## Properties

| Property | Type | Description |
| -------- | ---- | ----------- |
| `renderer?` | <code>(ctx: <a href="/grid/api/core/interfaces/cellrendercontext/">CellRenderContext</a>&lt;TRow, TValue&gt;) =&gt; VNode</code> | Vue render function for rendering cells of this type |
| `editor?` | <code>(ctx: <a href="/grid/api/core/interfaces/columneditorcontext/">ColumnEditorContext</a>&lt;TRow, TValue&gt;) =&gt; VNode</code> | Vue render function for editing cells of this type |
| `editorParams?` | <code>Record&lt;string, unknown&gt;</code> | Default editorParams for this type |
| `filterPanelRenderer?` | <code>(params: <a href="/grid/plugins/filtering/interfaces/filterpanelparams/">FilterPanelParams</a>) =&gt; VNode</code> | Vue render function for custom filter panels for this type. |

### Property Details

#### filterPanelRenderer

Vue render function for custom filter panels for this type.

Unlike the core imperative API `(container, params) => void`, this accepts
a Vue render function that receives only the params and returns a VNode.
The bridge handles mounting and appending to the container automatically.

```ts
import { h } from 'vue';
import CustomFilter from './CustomFilter.vue';

const typeDefault: TypeDefault = {
  filterPanelRenderer: (params) => h(CustomFilter, {
    field: params.field,
    uniqueValues: params.uniqueValues,
    onApply: (values: Set<unknown>) => params.applySetFilter(values),
  }),
};
```

---