31:T439,imageInput = function() { const inputForm = form(html` `); const container = html`

${inputForm}

`; container.value = null; inputForm.addEventListener('submit', function() { if (!inputForm.value.url && !inputForm.value.file) { container.value = null; container.dispatchEvent(new CustomEvent("input")); return; } var image = new Image(); image.src = inputForm.value.url ? inputForm.value.url : URL.createObjectURL(inputForm.value.file); image.crossOrigin = "anonymous"; image.onload = () => { container.value = image; container.dispatchEvent(new CustomEvent("input")); }; image.onerror = error => { container.value = error; container.dispatchEvent(new CustomEvent("input")); }; }); return container; }32:[] 2f:{"title":"image file or url input","cells":[{"id":0,"value":"md`# image file or url input\n\n⚠️ Note! This replicates most of https://observablehq.com/@mbostock/file-input?collection=@observablehq/libraries ... I'd just use that one.\n\n## Use\n\nSelect an image or URL.\n\n\\`\\`\\`js\nimport {imageInput} from \"@forresto/image-file-or-url-input\"\n\\`\\`\\`\n\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":18,"value":"viewof demoInput = imageInput()","pinned":true,"hidden":false,"mode":"ojs"},{"id":91,"value":"demoInput","pinned":true,"hidden":false,"mode":"ojs"},{"id":122,"value":"md`## Implementation`","pinned":true,"hidden":false,"mode":"ojs"},{"id":17,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"md`## Libraries`","pinned":false,"hidden":false,"mode":"ojs"},{"id":84,"value":"import {form} from \"@mbostock/form-input\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}