Generate Table

Build a table generator: two number inputs — rows and columns — and a table that fills with sequential numbers to match. Change either input and the grid redraws. The whole trick is a single mapping: the cell at row r, column c holds r * cols + c + 1, which turns a 2-D position into the running count 1, 2, 3, ….

Signature

// A self-contained component. No props.
function App(): JSX.Element;

Two controlled number inputs (rows, cols) and a <table> derived from them.

Examples

rows = 3, cols = 4 →
  1  2  3  4
  5  6  7  8
  9 10 11 12

rows = 2, cols = 2 →
  1 2
  3 4

Notes

• Row-major numbering. Numbers increase along each row, then continue on the next: r * cols + c + 1.
• Derive the grid from state. Don't keep a 2-D array in state; keep rows and cols and compute the cells on render.
• Clamp to ≥ 1. A zero or negative count should not produce an empty or broken table.
• Out of scope. Sorting, pagination, headers — this is purely "given counts, draw the grid."