fix(lib): Can't click on a link placed in a tooltip (#248)

Orange-OpenSource · Jun 14, 2024 · 497f572 · 497f572
1 parent 4d79737
commit 497f572
Show file tree

Hide file tree

Showing 6 changed files with 758 additions and 168 deletions.
diff --git a/docs/examples/index.js b/docs/examples/index.js
@@ -133,6 +133,7 @@ function generateConfigurator(id) {
                 <option value="none">None</option>
                 <option value="popover">Popover</option>
                 <option value="tooltip">Tooltip</option>
+                <option value="enterable">Enterable tooltip</option>
               </select>
             </div>
 
@@ -321,6 +322,15 @@ async function displayChart(
 
   legends = (options.legend && options.legend.data && !options.legend.show) || (options.dataset && options.dataset.source);
 
+  if ('enterable' === popoverInput) {
+    if (!options.tooltip) {
+      options.tooltip = {};
+    }
+    options.tooltip.enterable = true;
+  } else if (options.tooltip) {
+    delete options.tooltip.enterable;
+  }
+
   var dataOptions = JSON.parse(JSON.stringify(options));
 
   var chartId = id + '_chart';
@@ -408,7 +418,7 @@ themeManager.manageChartResize(myChart, '${chartId}');${
 themeManager.externalizePopover({
     enabled: ${'none' !== popoverInput ? 'true' : 'false'},
     shared: ${'shared' === popoverSharedInput ? 'true' : 'false'},
-    tooltip: ${'tooltip' === popoverInput ? 'true' : 'false'},
+    tooltip: ${'tooltip' === popoverInput || 'enterable' === popoverInput ? 'true' : 'false'},
     axisPointer: ODSCharts.ODSChartsPopoverAxisPointer.${popoverAxisInput},
   }, 
   ODSCharts.ODSChartsPopoverManagers.${'external' === popoverTemplateInput ? cssThemeName : 'NONE'}
@@ -497,7 +507,7 @@ myChart.setOption(themeManager.getChartOptions());
       {
         enabled: 'none' !== popoverInput,
         shared: 'shared' === popoverSharedInput,
-        tooltip: 'tooltip' === popoverInput,
+        tooltip: 'tooltip' === popoverInput || 'enterable' === popoverInput,
         axisPointer: popoverAxisInput,
       },
       iframe.contentWindow.ODSCharts.ODSChartsPopoverManagers[

diff --git a/docs/use_cases/confine-tooltip.html b/docs/use_cases/confine-tooltip.html
diff --git a/docs/use_cases/index.html b/docs/use_cases/index.html
@@ -46,11 +46,12 @@ <h1 class="display-1">Specific use cases illustrations</h1>
         <div class="col-12 col-lg-4 col-md-6 align-self-stretch py-2">
           <div class="card h-100">
             <div class="card-body">
-              <h5 class="card-title">Confine tooltip</h5>
+              <h5 class="card-title">Tooltip</h5>
               <p class="card-text">Prevent the tooltip or popover from being cut off at the edge of the graph.</p>
+              <p class="card-text">Specific tooltip content with links.</p>
             </div>
             <div class="card-footer">
-              <a href="./confine-tooltip.html" class="btn btn-primary mt-3">Go to example</a>
+              <a href="./tooltip.html" class="btn btn-primary mt-3">Go to example</a>
             </div>
           </div>
         </div>