Add copy buttons to code blocks and tool input and output

web/src/dom.ts

@@ -39,6 +39,23 @@ export function replace(el: Element, ...children: Child[]): void {
   append(el, ...children);
 }
 
+export function copyable(pre: HTMLPreElement): HTMLElement {
+  const button = h("button", { type: "button", class: "copy", title: "Copy to the clipboard" }, "copy");
+  button.onclick = async () => {
+    try {
+      await navigator.clipboard.writeText(pre.textContent ?? "");
+    } catch (err) {
+      void showAlert(errorText(err));
+      return;
+    }
+    button.textContent = "copied";
+    setTimeout(() => {
+      button.textContent = "copy";
+    }, 1500);
+  };
+  return h("div", { class: "copyable" }, pre, button);
+}
+
 export function ago(iso: string): string {
   const seconds = Math.round((Date.now() - Date.parse(iso)) / 1000);
   if (seconds < 60) {