31:[] 2f:{"title":"Inputs in grid","cells":[{"id":0,"value":"md`# Inputs in grid `","pinned":false,"hidden":false,"mode":"ojs"},{"id":5,"value":"md`Just a quick wrapper around [jashkenas/inputs](https://observablehq.com/@jashkenas/inputs) , so it's possible to position inputs in a grid.\n\nDoes not work for all inputs (multi checkboxes and canvas based inputs, like location coordinate picker ) , but it's enough for my needs for now.\n\nWe get result as array, which has additional properties attached for naming convenience (if you pass names array as a second parameter)\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":261,"value":"values","pinned":true,"hidden":false,"mode":"ojs"},{"id":308,"value":"viewof values = inputsGroup(\n [\n [\n Inputs.range([0, 100], { label: \"hello\" }),\n Inputs.range([0, 100]),\n Inputs.range([0, 100])\n ],\n [Inputs.range([0, 100]), Inputs.range([0, 100]), Inputs.range([0, 100])],\n [\n `

`, // Just a trick, to make select element centered\n Inputs.select([\"test\", \"name\"])\n ]\n ],\n\n [\n [\"first-input\", \"second-input\", \"third-slider\"],\n [\"4-th\", \"5-th\", \"6-th\"],\n [\"\", \"select\"]\n ]\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":311,"value":"valuesObjOnly","pinned":true,"hidden":false,"mode":"ojs"},{"id":10,"value":"viewof valuesObjOnly = inputsGroup(\n [\n [\n Inputs.range([0, 100]),\n ,\n Inputs.range([0, 100]),\n ,\n Inputs.range([0, 100])\n ],\n [\n Inputs.range([0, 100]),\n ,\n Inputs.range([0, 100]),\n ,\n Inputs.range([0, 100])\n ],\n [\n `

${views.map(\n (row) =>\n html`

${row.map(\n (input) =>\n html`

${input}

`\n )}

`;\n\n form.oninput = () => {\n const values = views.map((row) => row.map((input) => input.value));\n form.value = values;\n\n if (args && args.objOnly) form.value = {};\n if (names) {\n names.forEach((row, i) =>\n row.forEach(\n (c, j) => values[i][j] != null && (form.value[c] = values[i][j])\n )\n );\n }\n };\n form.oninput();\n return form;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":322,"value":"viewof range = Inputs.range([0, 100], {label: \"Amount\", step: 1})","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}