type

La sorte de valeur de la colonne : comment elle est lue, affichée, triée, filtrée et modifiée.

Type	ColumnType — "number" | "boolean" | "text" | "day" | "instant" | "enum" | "custom"
Par défaut	'text'
Modifiable en direct (update())	Oui — en redonnant les colonnes (update({ columns }))
Déclaré dans	packages/core/src/columns/defs.ts

Ce qu’il fait

• 'text' : un texte quelconque.
• 'number' : un nombre, affiché selon la locale de la grille (numberFormat), à la fin de la cellule.
• 'day' : un jour du calendrier, la chaîne 'YYYY-MM-DD'.
• 'instant' : un moment, en millisecondes depuis 1970 ou en texte ISO avec un décalage (Z, +02:00), affiché dans le timeZone de la grille (instantFormat, assumeZone). Une Date JavaScript n’est pas lue : donnez date.getTime().
• 'boolean' : oui ou non.
• 'enum' : une valeur d’une liste fermée, que donne enumOptions.
• 'custom' : votre propre codec, qu’il demande.

Une valeur que le type ne sait pas lire laisse la cellule vide, jamais devinée ; trier la colonne la signale par un avertissement invalid-cell-value (dix par colonne au plus). Un type inconnu, un enum sans enumOptions ou un custom sans codec est refusé avec une erreur invalid-column, et la colonne est écartée. Le type choisit aussi le filtre de la colonne.

Exemple

import { createGrid } from '@dzgrid/dom';
import { FR } from '@dzgrid/dom/locales/fr';

type Parcel = { id: string; code: string; weight: number; sentOn: string; arrivedAt: number | null; insured: boolean };

createGrid<Parcel>(document.getElementById('colis')!, {
  rows: [{ id: 'p1', code: 'px-104', weight: 2.4, sentOn: '2026-03-02', arrivedAt: 1772442000000, insured: true }],
  columns: [
    { id: 'code', header: 'Code' },
    { id: 'weight', header: 'Poids', type: 'number' },
    { id: 'sentOn', header: 'Envoyé le', type: 'day' },
    { id: 'arrivedAt', header: 'Arrivé', type: 'instant' },
    { id: 'insured', header: 'Assuré', type: 'boolean' },
  ],
  getRowId: (r) => r.id,
  messages: FR,
});

Démo

Voir aussi

• codec, filter.
• Colonnes.