dropArea = { const id = DOM.uid().id; const urls = []; const area = html`

`; const tbody = html``; const stats = html`${tbody}`; const clear = () => { tbody.replaceChildren(); for(const u of urls) URL.revokeObjectURL(u); } invalidation.then(clear); const asText = str => html`${str}`; const updateItemList = e => { clear(); const transfer = e.clipboardData || e.dataTransfer; for(const item of transfer.items) { const {kind, type} = item; const data = html`

`; const row = html`

`; tbody.appendChild(row); if(kind === 'file' && type.match(/^image\/(png|jpeg)$/)) { const url = URL.createObjectURL(item.getAsFile()); urls.push(url); data.appendChild(html`

`); } else item.getAsString(str => { try { if(['text/html'].includes(type) && formatHtml) { const root = document.createElement('ROOT'); root.append(html.fragment({raw: [str]})); data.append(inspectDOM(root)); return; } const o = JSON.parse(str); const i = new Inspector(data); i.fulfilled(o); } catch(e) { data.append(asText(str)); } }); } }; area.ondragover = e => { e.preventDefault(); e.dataTransfer.dropEffect = 'copy'; }; area.ondrop = e => { e.preventDefault(); updateItemList(e); } area.onpaste = e => { area.blur(); updateItemList(e); }; return html`

${area}

dataTransfer Items

${stats}

kind	type	data
${asText(item.kind)}	${asText(item.type)}	${data}