feat: pass FEEL popup links configuration

Related to bpmn-io/properties-panel#382

Author: philippfromme

src/render/BpmnPropertiesPanel.js

@@ -28,6 +28,8 @@ import { PanelPlaceholderProvider } from './PanelPlaceholderProvider';
  * @param {Object} props.layoutConfig
  * @param {Object} props.descriptionConfig
  * @param {Object} props.tooltipConfig
+ * @param {HTMLElement} props.feelPopupContainer
+ * @param {Function} props.getFeelPopupLinks
  */
 export default function BpmnPropertiesPanel(props) {
   const {
@@ -37,7 +39,8 @@ export default function BpmnPropertiesPanel(props) {
     layoutConfig: initialLayoutConfig,
     descriptionConfig,
     tooltipConfig,
-    feelPopupContainer
+    feelPopupContainer,
+    getFeelPopupLinks
   } = props;
 
   const canvas = injector.get('canvas');
@@ -238,6 +241,7 @@ export default function BpmnPropertiesPanel(props) {
       tooltipConfig={ tooltipConfig }
       tooltipLoaded={ onTooltipLoaded }
       feelPopupContainer={ feelPopupContainer }
+      getFeelPopupLinks={ getFeelPopupLinks }
       eventBus={ eventBus } />
   </BpmnPropertiesPanelContext.Provider>;
 }

src/render/BpmnPropertiesPanelRenderer.js

@@ -31,7 +31,8 @@ export default class BpmnPropertiesPanelRenderer {
       layout: layoutConfig,
       description: descriptionConfig,
       tooltip: tooltipConfig,
-      feelPopupContainer
+      feelPopupContainer,
+      getFeelPopupLinks
     } = config || {};
 
     this._eventBus = eventBus;
@@ -40,6 +41,7 @@ export default class BpmnPropertiesPanelRenderer {
     this._descriptionConfig = descriptionConfig;
     this._tooltipConfig = tooltipConfig;
     this._feelPopupContainer = feelPopupContainer;
+    this._getFeelPopupLinks = getFeelPopupLinks;
 
     this._container = domify(
       '<div style="height: 100%" class="bio-properties-panel-container"></div>'
@@ -176,6 +178,7 @@ export default class BpmnPropertiesPanelRenderer {
         descriptionConfig={ this._descriptionConfig }
         tooltipConfig={ this._tooltipConfig }
         feelPopupContainer={ this._feelPopupContainer }
+        getFeelPopupLinks={ this._getFeelPopupLinks }
       />,
       this._container
     );

test/spec/BpmnPropertiesPanelRenderer.spec.js

@@ -22,6 +22,7 @@ import {
 
 import {
   query as domQuery,
+  queryAll as domQueryAll,
   domify
 } from 'min-dom';
 
@@ -932,6 +933,59 @@ describe('<BpmnPropertiesPanelRenderer>', function() {
     });
 
 
+    it('should render links', async function() {
+
+      // given
+      const diagramXml = require('test/fixtures/service-task.bpmn').default;
+
+      let modeler;
+
+      await act(async () => {
+        ({ modeler } = await createModeler(diagramXml, {
+          propertiesPanel: {
+            parent: propertiesContainer,
+            feelPopupContainer: container,
+            getFeelPopupLinks: (type) => {
+              if (type === 'feel') {
+                return [
+                  { href: 'https://foo.com/', title: 'Foo' },
+                  { href: 'https://bar.com/', title: 'Bar' }
+                ];
+              }
+
+              return [];
+            }
+          }
+        }));
+      });
+
+      await act(() => {
+        const elementRegistry = modeler.get('elementRegistry'),
+              selection = modeler.get('selection');
+
+        selection.select(elementRegistry.get('ServiceTask_1'));
+      });
+
+      // when
+      await triggerPopupOpen('ServiceTask_1-input-0-source', container);
+
+      const feelPopup = getFeelPopupElement(container);
+
+      // then
+      expect(feelPopup).to.exist;
+
+      const links = domQueryAll('.bio-properties-panel-feel-popup__title-link', container);
+
+      expect(links.length).to.equal(2);
+
+      expect(links[0].href).to.equal('https://foo.com/');
+      expect(links[0].textContent).to.equal('Foo');
+
+      expect(links[1].href).to.equal('https://bar.com/');
+      expect(links[1].textContent).to.equal('Bar');
+    });
+
+
     describe('module support', function() {
 
       let modeler;