How can i make the expandable subrows take the whole row width and not only render in a sub cell?

[Stanmr]

Hello! I'm trying to set a table with expandable rows, the documentation shows an example where both row and subrow share the same data structure, i'm trying to create a subrow with totally different column structure but all i've been able to do is to render the subrow but it takes only one cell and this is making the first header to change width so the subrow can actually render inside.

this is my snippet inside the table

{row.getCanExpand() && row.getIsExpanded() ? (
  <Table.Tr>
    {row.original['workflows'].map((workflow: any, index: any) => (
      // Only do this if items have no stable IDs
      <BusinessTask
        className="flex m-3"
        key={index}
        taskName={workflow.label}
        dueDate={new Date(workflow.date_due)}
        dueThisMonth={workflow.is_due_this_month}
        isLate={workflow.is_late}
        paymentAmount={59.96}
      />
    ))}
  </Table.Tr>
  ) : (
  ''
  )}

Notice the checkbox header take the subrow width.

Thanks in advance, i've been trying to accomplish this for 2 weeks now with no success.

[jgarplind]

It's not clear to me what your desired UI looks like. If you could clarify that with a mock-up or just some arrow on top of your original image, it would be easier to help.