Is your feature request related to a problem? Please describe.

When adding multiple tables to the canvas, each new table currently appears at the same coordinates as the previous one. This causes them to overlap directly, hiding earlier tables. Users need to manually drag each new table away before they can see it clearly.

This behavior is technically functional, but it creates a confusing UX.

Current Behavior

Adding multiple tables places them on top of each other.
Overlapping hides previous tables until the user manually moves them.

Expected Behavior

Each new table should appear slightly offset from the previous table’s position, so all tables are visible without extra movement.

Describe the solution you'd like
Offset the position of each new table by +20px right and +20px down relative to the last added table.

let newPosition = { x: transform.pan.x, y: transform.pan.y };
if (tables.length > 0) {
  const lastTable = tables[tables.length - 1];
  if (lastTable) {
    newPosition = { x: lastTable.x + 20, y: lastTable.y + 20 };
  }
}

This creates a simple “card deck” effect where new tables are neatly visible without hiding the others.

Additional context

Example (before):

Example (after with suggested fix):

Happy to open a PR for this !!