Generating inputs based on JSON data and store selected values in an object

[spandl]

I'm trying to create multiple input fields based on a JSON file. The selected values should then be stored in a new object.
I'm getting pretty far, but the last pice of storing values without knowing the variable names is always returning an Async Generator and not the value.

Here is what I have so far

// Define list of inputs (simple example - will get more complex over time)
const inputJSON = [
  {
    list: ["A", "B", "D", "Z", "A", "E"],
    label: "List 1",
    name: "input1",
  },
  {
    list: [1, 2, 3],
    label: "List 2",
    name: "input2",
  },
  {
    list: [50, 100, 200],
    label: "List 3",
    name: "input3",
  },
];

// create all input elements based on JSON data
const allInputs = inputJSON.map((d, i) =>
  Inputs.select(inputJSON[i].list, {
    sort: true,
    unique: true,
    label: inputJSON[i].label,
  })
);

// print input elements on page
inputJSON.forEach((d, i) => {
  view(allInputs[i]);
});

// Return all values that are selected 
const getVariables = () => {
  const variables = {};
  inputJSON.forEach((d, i) => {
    variables[d.name] = Generators.input(allInputs[i]);
  });

  return variables;
};

/*  
This is where I am stuck.
I can destructure the variables and then I can use them with `view()`

But this means, I have to know the variable names, but I would much rather loop through the initial JSON file to get an object like
{
    input1: "value 1",
    input2: "value 2",
    input2: "value 3",
}
*/
const { input1, input2, input3 } = getVariables();

view("Print result on page (works great)");
view(input1);
view(input2);
view(input3);

What I would like to do

const configuration = getVariables();

configuration.forEach((d) => {
   view(d);
 });

console.log(configuration)

returns

input1 =
observe {[[GeneratorState]]: 'suspended'}
input2 =
observe {[[GeneratorState]]: 'suspended'}
input3 =
observe {[[GeneratorState]]: 'suspended'}

But I would have expected the variable values.

Thanks!

[Fil]

Did you try Inputs.form?

[spandl]

This was the missing piece!
I did see it, but I didn't read it properly. So easy now.

const inputJSON = [
  {
    list: ["A", "B", "D", "Z", "A", "E"],
    label: "List 1",
    name: "input1",
  },
  {
    list: [1, 2, 3],
    label: "List 2",
    name: "input2",
  },
  {
    list: [50, 100, 200],
    label: "List 3",
    name: "input3",
  },
];

const allInputs = inputJSON.map((d, i) =>
  Inputs.select(inputJSON[i].list, {
    sort: true,
    unique: true,
    label: inputJSON[i].label,
  })
);

const allFormInputs = view(Inputs.form(allInputs));

view(allFormInputs);
const configuration = inputJSON.reduce((acc, value, index) => {
  acc[value.name] = allFormInputs[index];
  return acc;
}, {});

view("Now print the result");
view(configuration);

Thank You!