> For the complete documentation index, see [llms.txt](https://voici.larswaechter.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://voici.larswaechter.dev/examples/typescript.md).

# Typescript

voici.js in combination with Typescript.

### Type Information

When using Typescript you can provide the type of the dataset rows using the diamond `<>` operator.

```javascript
import { Table } from 'voici.js'

interface IPerson {
  firstname: string;
  lastname: string;
  age: number;
}

const data = [
  { firstname: 'Homer', lastname: 'Simpson', age: 39 },
  { firstname: 'Marge', lastname: 'Simpson', age: 36 },
  { firstname: 'Bart', lastname: 'Simpson', age: 10 },
  { firstname: 'Lisa', lastname: 'Simpson', age: 8 },
  { firstname: 'Maggie', lastname: 'Simpson', age: 1 }
];

const table = new Table<IPerson>(data);
```

Here, `table.dataset` is of type `Person[]`.

{% hint style="info" %}
If you have no`interface`declared, you can still provide the type of your dataset by using `new Table<(typeof data)[number]>`.
{% endhint %}

### Config

When declaring a config variable you might have to set the according type.

```typescript
import { Table, Config } from 'voici.js'

const data = [
  { firstname: 'Marge', lastname: 'Simpson', age: 36 },
  { firstname: 'Homer', lastname: 'Simpson', age: 39 },
  { firstname: 'Peter', lastname: 'Griffin', age: 42 },
  { firstname: 'Lois', lastname: 'Griffin', age: 43 }
];

const config: Config = { // Set type 'Config'
  order: {
    columns: ['lastname'],
    directions: ['asc']
  }
};

const table = new Table(data, config);
```