feat: add highlightOnClick method

Author: javier-godoy

README.md

@@ -113,7 +113,7 @@ Commonly used boilerplate code from source snippets is automatically hidden:
   - `@com.flowingcode.vaadin.addons.demo.DemoSource`
   - `@java.lang.SupressWarning`
   - `@org.junit.Ignore`
-- Calls to `SourceCodeViewer.highlightOnHover` and `SourceCodeViewer.highlight`
+- Calls to `SourceCodeViewer.highlight`, `SourceCodeViewer.highlightOnHover` and `SourceCodeViewer.highlightOnClick`
 
 This feature cannot be disabled.
 
@@ -167,6 +167,7 @@ This feature supports highlighting a source code fragment in order to emphasize
 The highlighted fragment is automatically scrolled into view.
 
 A fragment is highlighted either by calling `SourceCodeViewer.highlight(name)` or when hovering a component that has been configured with `SourceCodeViewer.highlightOnHover(component,name)`, where `name` is the name of the fragment. `SourceCodeViewer.highlight(null)` turn off the highlighting.
+`SourceCodeViewer.highlightOnClick` allows configuring a click listener that turns highlight on.
 
 In the source code, a fragment is delimited by `// begin-block name` and `// end-block` comments. Nested fragments are not supported.
 The `// begin-block` and `// end-block` comments are removed after post-processing.

src/main/java/com/flowingcode/vaadin/addons/demo/SourceCodeViewer.java

@@ -20,7 +20,9 @@
 package com.flowingcode.vaadin.addons.demo;
 
 import com.flowingcode.vaadin.addons.DevSourceRequestHandler;
+import com.vaadin.flow.component.ClickNotifier;
 import com.vaadin.flow.component.Component;
+import com.vaadin.flow.component.HasElement;
 import com.vaadin.flow.component.HasSize;
 import com.vaadin.flow.component.UI;
 import com.vaadin.flow.component.dependency.JsModule;
@@ -89,6 +91,12 @@ public static void highlightOnHover(Component c, String id) {
     });
   }
 
+  public static <T extends HasElement & ClickNotifier<?>> void highlightOnClick(T c, String id) {
+    c.addClickListener(ev -> {
+      c.getElement().executeJs("Vaadin.Flow.fcCodeViewerConnector.highlight($0)", id);
+    });
+  }
+
   public static void highlight(String id) {
     UI.getCurrent().getElement().executeJs("Vaadin.Flow.fcCodeViewerConnector.highlight($0)", id);
   }

src/main/resources/META-INF/resources/frontend/code-viewer.ts

@@ -334,6 +334,7 @@ pre[class*="language-"] {
     && !line.startsWith('@Ignore')
     && !line.startsWith('package ')
     && !line.trim().startsWith('SourceCodeViewer.highlightOnHover(')
+    && !line.trim().startsWith('SourceCodeViewer.highlightOnClick(')
     && !line.trim().startsWith('SourceCodeViewer.highlight(')
     && line != 'import com.vaadin.flow.router.PageTitle;'
     && line != 'import com.vaadin.flow.router.Route;'

src/test/java/com/flowingcode/vaadin/addons/demo/SampleDemoHighlight.java

@@ -54,9 +54,9 @@ public SampleDemoHighlight() {
     HorizontalLayout hl = new HorizontalLayout();
 
     // begin-block button
-    hl.add(new Button("Click me", ev -> {
-      SourceCodeViewer.highlight("button");
-    }));
+    Button button = new Button("Click me");
+    SourceCodeViewer.highlightOnClick(button, "button");
+    add(button);
     // end-block
 
     hl.add(new Button("Highlight Off", ev -> {