<script setup lang="ts">
import { Grid, type ColumnDefinition } from "gp-grid-vue";

const columns: ColumnDefinition[] = [
  { field: "id", cellDataType: "number", width: 80, headerName: "ID" },
  { field: "name", cellDataType: "text", width: 150, headerName: "Name" },
  { field: "email", cellDataType: "text", width: 250, headerName: "Email" },
];

const data = [
  { id: 1, name: "Giovanni", email: "giovanni@example.com" },
  { id: 2, name: "Luca", email: "luca@example.com" },
];
</script>

<template>
  <div style="width: 800px; height: 400px">
    <Grid :columns="columns" :row-data="data" :row-height="36" />
  </div>
</template>