Table

A responsive table component for displaying tabular data.

Invoice Table

A table showing a list of recent invoices.

A list of your recent invoices.
InvoiceStatusMethodAmount
INV001PaidCredit Card$250.00
INV002PendingPayPal$150.00
INV003UnpaidBank Transfer$350.00
INV004PaidCredit Card$450.00
INV005PaidPayPal$550.00
Total$1,750.00
Open Markdown
FreeTable

Static tabular layout.

Install with the Proa CLI
proa ui add table

Installs the reviewed component source, dependencies, shared support files, and required legal notices.

CLI and registry setup
recipe.rs
// SPDX-FileCopyrightText: 2026 Proa Labs, Inc.
// SPDX-License-Identifier: MIT OR Apache-2.0

//! Table recipe — static named slots for responsive table parts.

use crate::tw_join;
use proa_core::shared::attr_value::AttrValue;
use proa_core::{DataLoader, WebContext, WriteBuf, WriteError};

mod base {
    use super::*;

    pub const CONTAINER: &str = tw_join!("relative", "w-full", "overflow-auto");
    pub const ROOT: &str = tw_join!("w-full", "caption-bottom", "text-sm");
    pub const HEADER: &str = "[&_tr]:border-b";
    pub const BODY: &str = "[&_tr:last-child]:border-0";
    pub const FOOTER: &str = tw_join!(
        "bg-muted/50",
        "border-t",
        "font-medium",
        "[&>tr]:last:border-b-0"
    );

Search

Type at least 2 characters

Customize

Make it yours

Palette

Radius

Overview
Components
Settings

Build your own

Themed Proa UI surface

Preview
Components52
RecipesTyped
customer-portal