Widths and Scroll

Tables can use minimum width and column widths to create predictable horizontal layouts.

Table min width

table: {
  minWidth: 960
}

table: {
  minWidth: "72rem"
}

When minWidth is set, the table is wrapped in a horizontal overflow container.

Column widths

table: {
  columns: [
    { key: "name", label: "Name", width: 30 },
    { key: "email", label: "Email", width: "40%" },
    { key: "status", label: "Status", width: "10rem" }
  ]
}

Width behavior:

• numeric widths are treated as percentages
• percentage strings are normalized
• other strings are used as CSS widths
• if any column has width, table layout becomes fixed
• remaining columns share remaining percentage width

Row number width

table: {
  rowNumber: {
    enabled: true,
    label: "#",
    width: "w-16"
  }
}

Row number width is applied as a class to the row number cell.

Action column width

The action column uses a compact w-px whitespace-nowrap layout.