components/datatable
Affichage · 31 / 64

DataTable

ui.widgets.DataTable

Un tableau de données avec filtrage, pagination et comportement de colonnes.

BEHAVIOR CONTRACT

filter, page, columns et rows forment un seul modèle d'état lisible.

RECORDED INTERACTION

Le harness tape « admin » et la page de résultats change.

examples/storybook/stories.zig:3101
pub fn buildDataTable(scope: *ui.Scope, cx: *ui.Cx) anyerror!*ui.Node {
    const dt = try ui.widgets.DataTable(.{
        .columns = &DT_COLS,
        .rows = &DT_ROWS,
        .page_size = 3,
    }, scope, cx);
    if (dt.filter_input) |fi| fi.meta.ownership.meta.test_id = "story.datatable.filter";
    dt.wrapper.meta.ownership.meta.test_id = "story.datatable.table";
    return dt.wrapper;
}
Voir le code sur GitHubexamples/storybook/stories.zig:3101

Le code source tel quel de la story dans le Storybook (zenit 5f9add5+wip 2026-09-30). W désigne ui.widgets ; col / row / label sont de petits helpers de mise en page du Storybook.

zenit · Double licenceGratuit pour les projets open source sous GPL-3.0-only ; les produits propriétaires ou commerciaux nécessitent une licence commerciale.Contacter l’auteur : zongyi.xzy#gmail.com (remplacez # par @)zenit 5f9add5+wip 2026-09-30