content, css: generateTextWithTooltip: custom interaction cues

1 files changed, 17 insertions, 2 deletions

diff --git a/src/content/dependencies/generateTextWithTooltip.js b/src/content/dependencies/generateTextWithTooltip.js
index 518e8782..462557d1 100644
--- a/src/content/dependencies/generateTextWithTooltip.js
+++ b/src/content/dependencies/generateTextWithTooltip.js
@@ -7,6 +7,11 @@ export default {
       mutable: false,
     },
 
+    customInteractionCue: {
+      type: 'boolean',
+      default: false,
+    },
+
     text: {
       type: 'html',
       mutable: false,
@@ -37,10 +42,20 @@ export default {
       });
     }
 
+    const textPart =
+      (hasTooltip && slots.customInteractionCue
+        ? html.tag('span', {class: 'hoverable'},
+            slots.text)
+     : hasTooltip
+        ? html.tag('span', {class: 'hoverable'},
+            html.tag('span', {class: 'text-with-tooltip-interaction-cue'},
+              slots.text))
+        : slots.text);
+
     const content =
       (hasTooltip
-        ? [slots.text, slots.tooltip]
-        : slots.text);
+        ? [textPart, slots.tooltip]
+        : textPart);
 
     return html.tag('span', attributes, content);
   },