feat: make datatip text selectable

atom-community · Feb 2, 2021 · 9c2a28e · 9c2a28e
1 parent c5d18d5
commit 9c2a28e
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/lib/datatip-manager.ts b/lib/datatip-manager.ts
@@ -474,6 +474,10 @@ export class DataTipManager {
     const overlayMarker = editor.markBufferRange(new Range(position, position), {
       invalidate: "never",
     })
+
+    // makes the text selectable with the help of user-select: text
+    element.setAttribute("tabindex", "-1")
+
     editor.decorateMarker(overlayMarker, {
       type: "overlay",
       class: "datatip-overlay",

diff --git a/styles/atom-ide-datatips.less b/styles/atom-ide-datatips.less
@@ -5,8 +5,9 @@
   overflow: auto; // prevents the long text to come out of the datatip
   color: @syntax-text-color;
   white-space: nowrap;
+
   pointer-events: all; // hyperlinks will work
-  // user-select: text;   // allow selecting text // TODO does not work
+  user-select: text; // allow selecting text
 
   font-family: @font-family;
   font-size: var(--editor-font-size);
@@ -85,20 +86,17 @@
   .list-tree {
     cursor: inherit;
   }
-  // user-select: text;   // allow selecting text // TODO does not work
 }
 
 /** Applied to MarkdownView */
 
 .datatip-markdown > div:not(:last-child) {
   border-bottom: 1px solid fade(@syntax-cursor-color, 10%);
-  // user-select: text;   // allow selecting text // TODO does not work
 }
 
 .datatip-markdown-container {
   color: @syntax-text-color;
   white-space: normal;
-  // user-select: text;
 
   // Avoid excess internal padding from markdown blocks.
   :first-child {
@@ -130,7 +128,6 @@
   .cursors {
     display: none;
   }
-  // user-select: text;   // allow selecting text // TODO does not work
 }
 
 // Highlight the hovered words