# useGrid

> _Since v0.0.1_

Hook for programmatic access to a grid instance.

## Usage

```tsx
import { DataGrid, useGrid } from '@toolbox-web/grid-react';

function MyComponent() {
  const { ref, isReady, getConfig, forceLayout } = useGrid<Employee>();

  const handleResize = async () => {
    await forceLayout();
  };

  const handleExport = async () => {
    const config = await getConfig();
    console.log('Exporting with columns:', config?.columns);
  };

  return (
    <>
      <button onClick={handleResize}>Force Layout</button>
      <button onClick={handleExport} disabled={!isReady}>Export</button>
      <DataGrid ref={ref} rows={rows} />
    </>
  );
}
```

```ts
useGrid(selector: string): UseGridReturn<TRow>
```

## Parameters

| Name | Type | Description |
| ---- | ---- | ----------- |
| `selector` | <code>string</code> | Optional CSS selector to target a specific grid element via
  DOM query instead of using `ref`. Use when the component contains multiple
  grids, e.g. `'tbw-grid.primary'` or `'#my-grid'`. |