import { Meta } from '@storybook/addon-docs/blocks'

<Meta title="pv-grid/Hooks/useGridRow" />

# useGridRow

If you need to use `row` data in a custom Renderer, you will need to use this hook to give your cell access to the full row data. Note, this does not include information about row selection – this will be the data you provided for this row.

```tsx
import { useGridRow } from '@planview/pv-grid'
```

### Definition

```
function useGridRow<TDataModel = any> = (
    id: string
) : TDataModel
```

### Usage

For more information on using this in a `Renderer` function, please see [the Cell Rendering Guide](/docs/pv-grid-guides-1-cell-rendering--docs).

In the following example, `label` is already the value of the `name` field because of the columnId, but `prefix` can be used in the renderer by using `useGridRow`.

```tsx
type Book = {
    id: string
    name: string
    prefix: string
}

const column: Column<Book> = {
    id: 'name',
    tree: true,
    cell: {
        Renderer({ rowId, label, tabIndex }) {
            const rowData = useGridRow<Book>(rowId)

            return (
                <GridCellDefault
                    tabIndex={tabIndex}
                    label={rowData.prefix + ': ' + label}
                />
            )
        },
    },
}
```
