Add a rich/text-only copy/paste mode

web-frontend/modules/database/utils/clipboard.js

@@ -3,15 +3,24 @@
  * using the documents `copy` command.
  */
 export const copyToClipboard = (text) => {
-  const textarea = document.createElement('textarea')
-  document.body.appendChild(textarea)
-
-  textarea.style.position = 'absolute'
-  textarea.style.left = '-99999px'
-  textarea.style.top = '-99999px'
-  textarea.value = text
-  textarea.select()
-
-  document.execCommand('copy')
-  document.body.removeChild(textarea)
+  navigator.clipboard.writeText(text)
+}
+
+/**
+ * Values should be an object with mimetypes as key and clipboard content for this type
+ * as value. This allow add the same data with multiple representation to the clipboard.
+ * We can have a row saved as tsv string or as json string. Values must be strings.
+ * @param {object} values object of mimetypes -> clipboard content.
+ */
+export const setRichClipboard = (values) => {
+  const listener = (e) => {
+    Object.entries(values).forEach(([type, content]) => {
+      e.clipboardData.setData(type, content)
+    })
+    e.preventDefault()
+    e.stopPropagation()
+  }
+  document.addEventListener('copy', listener)
+  document.execCommand('copy')
+  document.removeEventListener('copy', listener)
 }