camunda-bpmn-js 1.5.0 → 2.0.1

package/dist/camunda-cloud-modeler.development.js

@@ -41744,7 +41744,7 @@
     return element.waypoints;
   }
 
-  var createAppendAnythingModule = {
+  var CreateAppendAnythingModule = {
     __depends__: [
       PaletteModule$1,
       PopupMenuModule$1,
@@ -64241,7 +64241,7 @@
     ContextPadModule,
     CopyPasteModule,
     CreateModule,
-    createAppendAnythingModule,
+    CreateAppendAnythingModule,
     DistributeElementsModule,
     EditorActionsModule,
     GridSnappingModule,
@@ -65328,7 +65328,7 @@
     };
   }
 
-  var index$4 = {
+  var index$5 = {
     __init__: [ 'minimap' ],
     minimap: [ 'type', Minimap ]
   };
@@ -90495,7 +90495,7 @@
   }
   debounceInput.$inject = ['config.debounceInput'];
 
-  var index = {
+  var index$4 = {
     debounceInput: ['factory', debounceInput]
   };
 
@@ -94424,7 +94424,7 @@
   };
 
   var index$3 = {
-    __depends__: [Commands, index],
+    __depends__: [Commands, index$4],
     __init__: ['propertiesPanel'],
     propertiesPanel: ['type', BpmnPropertiesPanelRenderer]
   };
@@ -104832,7 +104832,7 @@
   };
 
   Modeler$1.prototype._extensionModules = [
-    index$4,
+    index$5,
     ExecutableFixModule,
     index$3,
     index$2
@@ -109544,13 +109544,13 @@
    */
   ElementTemplatesReplaceProvider.prototype._getMatchingTemplates = function(element) {
     return this._elementTemplates.getLatest().filter(template => {
-      return isAny(element, template.appliesTo) && !isTemplateApplied(element, template);
+      return isAny(element, template.appliesTo) && !isTemplateApplied$1(element, template);
     });
   };
 
 
   // helpers ////////////
-  function isTemplateApplied(element, template) {
+  function isTemplateApplied$1(element, template) {
     const businessObject = getBusinessObject$2(element);
 
     if (businessObject) {
@@ -110215,6 +110215,195 @@
     elementTemplatesCreateProvider: [ 'type', ElementTemplatesCreateProvider ]
   };
 
+  /**
+   * An element template chooser that hooks into
+   * properties panel fired "choose template" events.
+   *
+   * @param {Object} config
+   * @param {EventBus} eventBus
+   * @param {ElementTemplates} elementTemplates
+   * @param {Translate} translate
+   * @param {PopupMenu} popupMenu
+   */
+  function ElementTemplateChooser(
+      config,
+      eventBus,
+      elementTemplates,
+      translate,
+      popupMenu) {
+
+    this._eventBus = eventBus;
+    this._elementTemplates = elementTemplates;
+    this._translate = translate;
+    this._popupMenu = popupMenu;
+
+    const enableChooser = !config || config.elementTemplateChooser !== false;
+
+    enableChooser && eventBus.on('elementTemplates.select', (event) => {
+
+      const { element } = event;
+
+      this.open(element).then(template => {
+        elementTemplates.applyTemplate(element, template);
+      }).catch(err => {
+        if (err !== 'user-canceled') {
+          console.error('elementTemplate.select :: error', err);
+        }
+      });
+    });
+  }
+
+  ElementTemplateChooser.$inject = [
+    'config.connectorsExtension',
+    'eventBus',
+    'elementTemplates',
+    'translate',
+    'popupMenu'
+  ];
+
+  ElementTemplateChooser.prototype.open = function(element) {
+
+    const popupMenu = this._popupMenu;
+    const translate = this._translate;
+    const eventBus = this._eventBus;
+
+    return new Promise((resolve, reject) => {
+
+      const handleClosed = () => reject('user-canceled');
+
+      eventBus.once('popupMenu.close', handleClosed);
+
+      eventBus.once('elementTemplateChooser.chosen', event => {
+
+        const { template } = event;
+
+        eventBus.off('popupMenu.close', handleClosed);
+
+        resolve(template);
+      });
+
+      popupMenu.open(element, 'element-template-chooser', { x: 0, y: 0 }, {
+        title: translate('Choose element template'),
+        search: true,
+        width: 350
+      });
+    });
+
+  };
+
+  /**
+   * A entry provider for the <element-template-chooser> popup menu.
+   */
+  function ElementTemplateChooserEntryProvider(popupMenu, eventBus, translate, elementTemplates) {
+
+    this._popupMenu = popupMenu;
+    this._eventBus = eventBus;
+    this._translate = translate;
+    this._elementTemplates = elementTemplates;
+
+    this.register();
+  }
+
+  ElementTemplateChooserEntryProvider.$inject = [
+    'popupMenu',
+    'eventBus',
+    'translate',
+    'elementTemplates'
+  ];
+
+  /**
+   * Register replace menu provider in the popup menu
+   */
+  ElementTemplateChooserEntryProvider.prototype.register = function() {
+    this._popupMenu.registerProvider('element-template-chooser', this);
+  };
+
+  /**
+   * Adds the element templates to the replace menu.
+   * @param {djs.model.Base} element
+   *
+   * @returns {Object}
+   */
+  ElementTemplateChooserEntryProvider.prototype.getPopupMenuEntries = function(element) {
+
+    // convert to object
+    return this.getTemplateEntries(element).reduce((entries, [ key, value ]) => {
+      entries[key] = value;
+
+      return entries;
+    }, {});
+
+  };
+
+  /**
+   * Get all element templates that can be used to replace the given element.
+   *
+   * @param {djs.model.Base} element
+   *
+   * @return {Array<Object>} a list of element templates as menu entries
+   */
+  ElementTemplateChooserEntryProvider.prototype.getTemplateEntries = function(element) {
+
+    const eventBus = this._eventBus;
+    const translate = this._translate;
+
+    return this._getMatchingTemplates(element).map(template => {
+
+      const {
+        icon = {},
+        category
+      } = template;
+
+      const entryId = `apply-template-${ template.id }`;
+
+      return [ entryId, {
+        label: template.name && translate(template.name),
+        description: template.description && translate(template.description),
+        documentationRef: template.documentationRef,
+        imageUrl: icon.contents,
+        group: category && { ...category, name: translate(category.name) },
+        action: () => {
+          eventBus.fire('elementTemplateChooser.chosen', { element, template });
+        }
+      } ];
+    });
+  };
+
+  /**
+   * Returns the templates that can the element can be replaced with.
+   *
+   * @param  {djs.model.Base} element
+   *
+   * @return {Array<ElementTemplate>}
+   */
+  ElementTemplateChooserEntryProvider.prototype._getMatchingTemplates = function(element) {
+    return this._elementTemplates.getLatest().filter(template => {
+      return isAny(element, template.appliesTo) && !isTemplateApplied(element, template);
+    });
+  };
+
+
+  // helpers ////////////
+
+  function isTemplateApplied(element, template) {
+    const businessObject = getBusinessObject$2(element);
+
+    if (businessObject) {
+      return businessObject.get('modelerTemplate') === template.id;
+    }
+
+    return false;
+  }
+
+  var index = {
+    __init__: [
+      'elementTemplateChooser',
+      'elementTemplateChooserEntryProvider'
+    ],
+    elementTemplateChooser: [ 'type', ElementTemplateChooser ],
+    elementTemplateChooserEntryProvider: [ 'type', ElementTemplateChooserEntryProvider ]
+  };
+
   var inherits_browser = {exports: {}};
 
   if (typeof Object.create === 'function') {
@@ -110772,21 +110961,21 @@
       propertiesPanel: {
         description: DescriptionProvider,
         ...options.propertiesPanel
-      }
+      },
     };
 
-    this._removeCreateAppendAnything(options);
+    this._addElementTemplateChooserModule(options);
 
     Modeler$1.call(this, options);
   }
 
   e$6(Modeler, Modeler$1);
 
-  Modeler.prototype._removeCreateAppendAnything = function(options) {
-    const { connectorsExtension } = options;
+  Modeler.prototype._addElementTemplateChooserModule = function(options) {
+    const { elementTemplateChooser } = options;
 
-    if (connectorsExtension && connectorsExtension.appendAnything === false) {
-      this._modules = without(this._modules, createAppendAnythingModule);
+    if (elementTemplateChooser !== false) {
+      this._modules = [ ...this._modules, index ];
     }
   };