Adds 'event' handler for canvas expression renderers (#101502)

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

x-pack/plugins/canvas/public/lib/create_handlers.ts

@@ -6,6 +6,10 @@
  */
 
 import { isEqual } from 'lodash';
+import {
+  ExpressionRendererEvent,
+  IInterpreterRenderHandlers,
+} from 'src/plugins/expressions/public';
 // @ts-expect-error untyped local
 import { setFilter } from '../state/actions/elements';
 import { updateEmbeddableExpression, fetchEmbeddableRenderable } from '../state/actions/embeddable';
@@ -14,38 +18,41 @@ import { RendererHandlers, CanvasElement } from '../../types';
 // This class creates stub handlers to ensure every element and renderer fulfills the contract.
 // TODO: consider warning if these methods are invoked but not implemented by the renderer...?
 
-export const createHandlers = (): RendererHandlers => ({
-  destroy() {},
+// We need to move towards only using these handlers and ditching our canvas specific ones
+export const createBaseHandlers = (): IInterpreterRenderHandlers => ({
   done() {},
+  reload() {},
+  update() {},
   event() {},
+  onDestroy() {},
+  getRenderMode: () => 'display',
+  isSyncColorsEnabled: () => false,
+});
+
+export const createHandlers = (baseHandlers = createBaseHandlers()): RendererHandlers => ({
+  ...baseHandlers,
+  destroy() {},
+
   getElementId() {
     return '';
   },
   getFilter() {
     return '';
   },
-  getRenderMode() {
-    return 'display';
-  },
-  isSyncColorsEnabled() {
-    return false;
-  },
+
   onComplete(fn: () => void) {
     this.done = fn;
   },
-  onDestroy(fn: () => void) {
-    this.destroy = fn;
-  },
+
   // TODO: these functions do not match the `onXYZ` and `xyz` pattern elsewhere.
   onEmbeddableDestroyed() {},
   onEmbeddableInputChange() {},
   onResize(fn: (size: { height: number; width: number }) => void) {
     this.resize = fn;
   },
-  reload() {},
+
   resize(_size: { height: number; width: number }) {},
   setFilter() {},
-  update() {},
 });
 
 export const assignHandlers = (handlers: Partial<RendererHandlers> = {}): RendererHandlers =>
@@ -66,7 +73,33 @@ export const createDispatchedHandlerFactory = (
       oldElement = element;
     }
 
-    return assignHandlers({
+    const handlers: RendererHandlers & {
+      event: IInterpreterRenderHandlers['event'];
+      done: IInterpreterRenderHandlers['done'];
+    } = {
+      ...createHandlers(),
+      event(event: ExpressionRendererEvent) {
+        switch (event.name) {
+          case 'embeddableInputChange':
+            this.onEmbeddableInputChange(event.data);
+            break;
+          case 'setFilter':
+            this.setFilter(event.data);
+            break;
+          case 'onComplete':
+            this.onComplete(event.data);
+            break;
+          case 'embeddableDestroyed':
+            this.onEmbeddableDestroyed();
+            break;
+          case 'resize':
+            this.resize(event.data);
+            break;
+          case 'onResize':
+            this.onResize(event.data);
+            break;
+        }
+      },
       setFilter(text: string) {
         dispatch(setFilter(text, element.id, true));
       },
@@ -98,6 +131,8 @@ export const createDispatchedHandlerFactory = (
         isComplete = true;
         completeFn();
       },
-    });
+    };
+
+    return handlers;
   };
 };

x-pack/plugins/canvas/types/renderers.ts

@@ -9,7 +9,7 @@ import { IInterpreterRenderHandlers } from 'src/plugins/expressions';
 
 type GenericRendererCallback = (callback: () => void) => void;
 
-export interface RendererHandlers extends IInterpreterRenderHandlers {
+export interface CanvasSpecificRendererHandlers {
   /** Handler to invoke when an element should be destroyed. */
   destroy: () => void;
   /** Get the id of the element being rendered.  Can be used as a unique ID in a render function */
@@ -30,6 +30,7 @@ export interface RendererHandlers extends IInterpreterRenderHandlers {
   setFilter: (filter: string) => void;
 }
 
+export type RendererHandlers = IInterpreterRenderHandlers & CanvasSpecificRendererHandlers;
 export interface RendererSpec<RendererConfig = {}> {
   /** The render type */
   name: string;