Display and editing complex data

I am looking for suggestion how to display complex data for reading/editing.

Data will be key-value, example:

string-val: "v12", int-value: 99, boolean: true

I these types I think simple table will do the trick (with editable rows).

I will also have to support the following: array-val: [1, 2 ,3], object-value: {name: "bp", amount: 4}, array-object-value: [{name: "bp", amount: 4}, {name: "bp", amount: 4}]

I am considering using: https://material-ui.com/components/tables/#collapsible-table (just an example because we use material-ui), where the dropdown V will have an embedded table.

I am open for any suggestion, this is the only solution I can think of.