bpmn-js 11.1.0 → 11.2.0

package/lib/features/align-elements/dist/align-bottom-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25201800%25201800%2522%253E%253Cpath%2520d%253D%2522M150%25201650h1500%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%2522600%2522%2520height%253D%25221300%2522%2520x%253D%2522150%2522%2520y%253D%2522350%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522600%2522%2520height%253D%2522800%2522%2520x%253D%25221050%2522%2520y%253D%2522850%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/align-elements/dist/align-horizontal-center-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25201800%25201800%2522%253E%253Cpath%2520d%253D%2522M900%2520150v1500%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%25221300%2522%2520height%253D%2522600%2522%2520x%253D%2522250%2522%2520y%253D%2522150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522800%2522%2520height%253D%2522600%2522%2520x%253D%2522500%2522%2520y%253D%25221050%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/align-elements/dist/align-left-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25201800%25201800%2522%253E%253Cpath%2520d%253D%2522M100%2520150v1500%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%25221300%2522%2520height%253D%2522600%2522%2520x%253D%2522100%2522%2520y%253D%2522150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522800%2522%2520height%253D%2522600%2522%2520x%253D%2522100%2522%2520y%253D%25221050%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/align-elements/dist/align-right-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25201800%25201800%2522%253E%253Cpath%2520d%253D%2522M1650%2520150v1500%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%25221300%2522%2520height%253D%2522600%2522%2520x%253D%2522350%2522%2520y%253D%2522150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522800%2522%2520height%253D%2522600%2522%2520x%253D%2522850%2522%2520y%253D%25221050%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/align-elements/dist/align-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25202000%25202000%2522%253E%253Cpath%2520d%253D%2522M200%2520150v1700%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%25221300%2522%2520height%253D%2522700%2522%2520x%253D%2522500%2522%2520y%253D%2522150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522700%2522%2520height%253D%2522700%2522%2520x%253D%2522500%2522%2520y%253D%25221150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/align-elements/dist/align-top-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25201800%25201800%2522%253E%253Cpath%2520d%253D%2522M150%2520150h1500%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%2522600%2522%2520height%253D%25221300%2522%2520x%253D%2522150%2522%2520y%253D%2522150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522600%2522%2520height%253D%2522800%2522%2520x%253D%25221050%2522%2520y%253D%2522150%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/align-elements/dist/align-vertical-center-tool.svg

@@ -0,0 +1 @@
+data:image/svg+xml,data%3Aimage%2Fsvg%2Bxml%2C%253Csvg%2520xmlns%253D%2522http%253A%252F%252Fwww.w3.org%252F2000%252Fsvg%2522%2520viewBox%253D%25220%25200%25201800%25201800%2522%253E%253Cpath%2520d%253D%2522M150%2520900h1500%2522%2520style%253D%2522stroke%253AcurrentColor%253Bstroke-width%253A100%253Bstroke-linecap%253Around%2522%252F%253E%253Crect%2520width%253D%2522600%2522%2520height%253D%25221300%2522%2520x%253D%2522150%2522%2520y%253D%2522250%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253Anone%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%2522%252F%253E%253Crect%2520width%253D%2522600%2522%2520height%253D%2522800%2522%2520x%253D%25221050%2522%2520y%253D%2522500%2522%2520rx%253D%25221%2522%2520style%253D%2522fill%253AcurrentColor%253Bstroke%253AcurrentColor%253Bstroke-width%253A100%253Bopacity%253A.5%2522%252F%253E%253C%252Fsvg%253E

package/lib/features/context-pad/ContextPadProvider.js

@@ -173,7 +173,6 @@ ContextPadProvider.prototype.getContextPadEntries = function(element) {
     return pos;
   }
 
-
   /**
    * Create an append action
    *

package/lib/features/create-append-anything/AppendContextPadProvider.js

@@ -0,0 +1,77 @@
+import {
+  assign
+} from 'min-dash';
+
+import {
+  appendIcon
+} from '../../icons/Icons';
+
+var LOW_PRIORITY = 900;
+
+/**
+ * A provider for align elements context pad button
+ */
+export default function AppendContextPadProvider(contextPad, popupMenu, translate, canvas) {
+  contextPad.registerProvider(LOW_PRIORITY, this);
+
+  this._contextPad = contextPad;
+  this._popupMenu = popupMenu;
+  this._translate = translate;
+  this._canvas = canvas;
+}
+
+AppendContextPadProvider.$inject = [
+  'contextPad',
+  'popupMenu',
+  'translate',
+  'canvas'
+];
+
+AppendContextPadProvider.prototype.getContextPadEntries = function(element) {
+  const popupMenu = this._popupMenu;
+  const translate = this._translate;
+  const getAppendMenuPosition = this._getAppendMenuPosition.bind(this);
+
+  if (!popupMenu.isEmpty(element, 'bpmn-append')) {
+
+    // Replace menu entry
+    return {
+      'append': {
+        group: 'model',
+        imageUrl: appendIcon,
+        title: translate('Append element'),
+        action: {
+          click: function(event, element) {
+
+            var position = assign(getAppendMenuPosition(element), {
+              cursor: { x: event.x, y: event.y }
+            });
+
+            popupMenu.open(element, 'bpmn-append', position, {
+              title: translate('Append element'),
+              width: 300,
+              search: true
+            });
+          }
+        }
+      }
+    };
+  }
+};
+
+AppendContextPadProvider.prototype._getAppendMenuPosition = function(element) {
+  const contextPad = this._contextPad;
+
+  const X_OFFSET = 5;
+
+  const pad = contextPad.getPad(element).html;
+
+  const padRect = pad.getBoundingClientRect();
+
+  const pos = {
+    x: padRect.right + X_OFFSET,
+    y: padRect.top
+  };
+
+  return pos;
+};

package/lib/features/create-append-anything/AppendMenuProvider.js

@@ -0,0 +1,175 @@
+import { isUndefined } from 'min-dash';
+import { CREATE_OPTIONS } from './util/OptionsUtil';
+
+/**
+ * This module is an append menu provider for the popup menu.
+ */
+export default function AppendMenuProvider(
+    elementFactory,
+    popupMenu,
+    create,
+    autoPlace,
+    rules,
+    mouse
+) {
+  this._elementFactory = elementFactory;
+  this._popupMenu = popupMenu;
+  this._create = create;
+  this._autoPlace = autoPlace;
+  this._rules = rules;
+  this._create = create;
+  this._mouse = mouse;
+
+  this.register();
+}
+
+AppendMenuProvider.$inject = [
+  'elementFactory',
+  'popupMenu',
+  'create',
+  'autoPlace',
+  'rules',
+  'mouse'
+];
+
+/**
+ * Register append menu provider in the popup menu
+ */
+AppendMenuProvider.prototype.register = function() {
+  this._popupMenu.registerProvider('bpmn-append', this);
+};
+
+/**
+ * Get all entries from createOptions for the given element.
+ *
+ * @param {djs.model.Base} element
+ *
+ * @return {Array<Object>} a list of menu entry items
+ */
+AppendMenuProvider.prototype.getPopupMenuEntries = function(element) {
+  const rules = this._rules;
+  const entries = {};
+
+  if (!rules.allowed('shape.append', { element: element })) {
+    return [];
+  }
+
+  // filter out elements with no incoming connections
+  const appendOptions = this._filterEntries(CREATE_OPTIONS);
+
+  // map options to menu entries
+  appendOptions.forEach(option => {
+    const {
+      actionName,
+      className,
+      label,
+      target,
+      description,
+      group,
+      search
+    } = option;
+
+    entries[`append-${actionName}`] = {
+      label,
+      className,
+      description,
+      group,
+      search,
+      action: this._createEntryAction(element, target)
+    };
+  });
+
+  return entries;
+};
+
+/**
+ * Filter out entries from the options.
+ *
+ * @param {Array<Object>} entries
+ *
+ * @return {Array<Object>} filtered entries
+ */
+AppendMenuProvider.prototype._filterEntries = function(entries) {
+  return entries.filter(option => {
+
+    const target = option.target;
+    const {
+      type,
+      eventDefinitionType
+    } = target;
+
+    if ([
+      'bpmn:StartEvent',
+      'bpmn:Participant'
+    ].includes(type)) {
+      return false;
+    }
+
+    if (type === 'bpmn:BoundaryEvent' && isUndefined(eventDefinitionType)) {
+      return false;
+    }
+
+    return true;
+  });
+};
+
+/**
+ * Create an action for a given target.
+ *
+ * @param {djs.model.Base} element
+ * @param {Object} target
+ *
+ * @return {Object}
+ */
+AppendMenuProvider.prototype._createEntryAction = function(element, target) {
+  const elementFactory = this._elementFactory;
+  const autoPlace = this._autoPlace;
+  const create = this._create;
+  const mouse = this._mouse;
+
+
+  const autoPlaceElement = () => {
+    const newElement = elementFactory.create('shape', target);
+    autoPlace.append(element, newElement);
+  };
+
+  const manualPlaceElement = (event) => {
+    const newElement = elementFactory.create('shape', target);
+
+    if (event instanceof KeyboardEvent) {
+      event = mouse.getLastMoveEvent();
+    }
+
+    return create.start(event, newElement);
+  };
+
+  return {
+    click: this._canAutoPlaceElement(target) ? autoPlaceElement : manualPlaceElement,
+    dragstart: manualPlaceElement
+  };
+};
+
+/**
+ * Check if the element should be auto placed.
+ *
+ * @param {Object} target
+ *
+ * @return {Boolean}
+ */
+AppendMenuProvider.prototype._canAutoPlaceElement = (target) => {
+  const { type } = target;
+
+  if (type === 'bpmn:BoundaryEvent') {
+    return false;
+  }
+
+  if (type === 'bpmn:SubProcess' && target.triggeredByEvent) {
+    return false;
+  }
+
+  if (type === 'bpmn:IntermediateCatchEvent' && target.eventDefinitionType === 'bpmn:LinkEventDefinition') {
+    return false;
+  }
+
+  return true;
+};

package/lib/features/create-append-anything/AppendRules.js

@@ -0,0 +1,83 @@
+import {
+  find,
+} from 'min-dash';
+
+import inherits from 'inherits-browser';
+
+import {
+  is,
+  isAny,
+  getBusinessObject
+} from '../../util/ModelUtil';
+
+import {
+  isLabel
+} from '../../util/LabelUtil';
+
+import RuleProvider from 'diagram-js/lib/features/rules/RuleProvider';
+
+
+/**
+ * Append anything modeling rules
+ */
+export default function AppendRules(eventBus) {
+  RuleProvider.call(this, eventBus);
+}
+
+inherits(AppendRules, RuleProvider);
+
+AppendRules.$inject = [
+  'eventBus'
+];
+
+AppendRules.prototype.init = function() {
+  this.addRule('shape.append', function(context) {
+
+    var source = context.element;
+
+    const businessObject = getBusinessObject(source);
+
+    if (isLabel(source)) {
+      return false;
+    }
+
+    if (isAny(source, [
+      'bpmn:EndEvent',
+      'bpmn:Group',
+      'bpmn:TextAnnotation',
+      'bpmn:Lane',
+      'bpmn:Participant',
+      'bpmn:DataStoreReference',
+      'bpmn:DataObjectReference'
+    ])) {
+      return false;
+    }
+
+    if (isConnection(source)) {
+      return false;
+    }
+
+    if (is(source, 'bpmn:IntermediateThrowEvent') && hasEventDefinition(source, 'bpmn:LinkEventDefinition')) {
+      return false;
+    }
+
+    if (is(source, 'bpmn:SubProcess') && businessObject.triggeredByEvent) {
+      return false;
+    }
+  });
+
+};
+
+
+// helpers //////////////
+function hasEventDefinition(element, eventDefinition) {
+  var bo = getBusinessObject(element);
+
+  return !!find(bo.eventDefinitions || [], function(definition) {
+    return is(definition, eventDefinition);
+  });
+}
+
+function isConnection(element) {
+  return element.waypoints;
+}

package/lib/features/create-append-anything/CreateAppendEditorActions.js

@@ -0,0 +1,51 @@
+import { assign } from 'min-dash';
+
+/**
+ * Registers and executes BPMN specific editor actions.
+ *
+ * @param {Injector} injector
+ */
+export default function CreateAppendEditorActions(injector) {
+  this._injector = injector;
+
+  this.registerActions();
+}
+
+CreateAppendEditorActions.$inject = [
+  'injector'
+];
+
+/**
+ * Register actions.
+ *
+ * @param {Injector} injector
+ */
+CreateAppendEditorActions.prototype.registerActions = function() {
+  var editorActions = this._injector.get('editorActions', false);
+  var selection = this._injector.get('selection', false);
+  var contextPad = this._injector.get('contextPad', false);
+  var palette = this._injector.get('palette', false);
+
+  const actions = {};
+
+  // append
+  if (selection && contextPad) {
+    assign(actions, {
+      'appendElement': function(event) {
+        contextPad.triggerEntry('append', 'click', event);
+      } }
+    );
+  }
+
+  // create
+  if (palette) {
+    assign(actions, {
+      'createElement': function(event) {
+        palette.triggerEntry('create', 'click', event);
+      } }
+    );
+  }
+
+  editorActions && editorActions.register(actions);
+
+};

package/lib/features/create-append-anything/CreateAppendKeyboardBindings.js

@@ -0,0 +1,97 @@
+import inherits from 'inherits-browser';
+
+import KeyboardBindings from 'diagram-js/lib/features/keyboard/KeyboardBindings';
+
+
+/**
+ * BPMN 2.0 specific keyboard bindings.
+ *
+ * @param {Injector} injector
+ */
+export default function CreateAppendKeyboardBindings(injector) {
+
+  this._injector = injector;
+  this._keyboard = this._injector.get('keyboard', false);
+  this._editorActions = this._injector.get('editorActions', false);
+  this._selection = this._injector.get('selection', false);
+
+  if (this._keyboard) {
+    this._injector.invoke(KeyboardBindings, this);
+  }
+}
+
+inherits(CreateAppendKeyboardBindings, KeyboardBindings);
+
+CreateAppendKeyboardBindings.$inject = [
+  'injector'
+];
+
+
+/**
+ * Register available keyboard bindings.
+ *
+ * @param {Keyboard} keyboard
+ * @param {EditorActions} editorActions
+ */
+CreateAppendKeyboardBindings.prototype.registerBindings = function() {
+
+  var keyboard = this._keyboard;
+  var editorActions = this._editorActions;
+  var selection = this._selection;
+
+  // inherit default bindings
+  KeyboardBindings.prototype.registerBindings.call(this, keyboard, editorActions);
+
+  /**
+   * Add keyboard binding if respective editor action
+   * is registered.
+   *
+   * @param {string} action name
+   * @param {Function} fn that implements the key binding
+   */
+  function addListener(action, fn) {
+
+    if (editorActions && editorActions.isRegistered(action)) {
+      keyboard && keyboard.addListener(fn);
+    }
+  }
+
+  // activate append/create element
+  // A
+  addListener('appendElement', function(context) {
+
+    var event = context.keyEvent;
+
+    if (keyboard && keyboard.hasModifier(event)) {
+      return;
+    }
+
+    if (keyboard && keyboard.isKey([ 'a', 'A' ], event)) {
+
+      if (selection && selection.get().length == 1) {
+        editorActions && editorActions.trigger('appendElement', event);
+      } else {
+        editorActions && editorActions.trigger('createElement', event);
+      }
+
+      return true;
+    }
+  });
+
+  // N
+  addListener('createElement', function(context) {
+
+    var event = context.keyEvent;
+
+    if (keyboard && keyboard.hasModifier(event)) {
+      return;
+    }
+
+    if (keyboard && keyboard.isKey([ 'n', 'N' ], event)) {
+      editorActions && editorActions.trigger('createElement', event);
+
+      return true;
+    }
+  });
+
+};

package/lib/features/create-append-anything/CreateMenuProvider.js

@@ -0,0 +1,112 @@
+import { CREATE_OPTIONS } from './util/OptionsUtil';
+
+/**
+ * This module is a create menu provider for the popup menu.
+ */
+export default function CreateMenuProvider(
+    elementFactory, popupMenu, create,
+    autoPlace, mouse, translate
+) {
+  this._elementFactory = elementFactory;
+  this._popupMenu = popupMenu;
+  this._create = create;
+  this._autoPlace = autoPlace;
+  this._mouse = mouse;
+  this._translate = translate;
+
+  this.register();
+}
+
+CreateMenuProvider.$inject = [
+  'elementFactory',
+  'popupMenu',
+  'create',
+  'autoPlace',
+  'mouse',
+  'translate'
+];
+
+/**
+ * Register create menu provider in the popup menu
+ */
+CreateMenuProvider.prototype.register = function() {
+  this._popupMenu.registerProvider('bpmn-create', this);
+};
+
+/**
+ * Get all entries
+ *
+ * @param {djs.model.Base} element
+ *
+ * @return {Array<Object>} a list of menu entry items
+ */
+CreateMenuProvider.prototype.getPopupMenuEntries = function() {
+
+  const entries = {};
+
+  // map options to menu entries
+  CREATE_OPTIONS.forEach(option => {
+    const {
+      actionName,
+      className,
+      label,
+      target,
+      description,
+      group,
+      search
+    } = option;
+
+    const targetAction = this._createEntryAction(target);
+
+    entries[`create-${actionName}`] = {
+      label: label && this._translate(label),
+      className,
+      description,
+      group: group && {
+        ...group,
+        name: this._translate(group.name)
+      },
+      search,
+      action: {
+        click: targetAction,
+        dragstart: targetAction
+      }
+    };
+  });
+
+  return entries;
+};
+
+/**
+ * Create an action for a given target
+ *
+ * @param {Object} target
+ * @returns {Object}
+ */
+CreateMenuProvider.prototype._createEntryAction = function(target) {
+
+  const create = this._create;
+  const mouse = this._mouse;
+  const popupMenu = this._popupMenu;
+  const elementFactory = this._elementFactory;
+
+  let newElement;
+
+  return (event) => {
+    popupMenu.close();
+
+    // create the new element
+    if (target.type === 'bpmn:Participant') {
+      newElement = elementFactory.createParticipantShape(target);
+    } else {
+      newElement = elementFactory.create('shape', target);
+    }
+
+    // use last mouse event if triggered via keyboard
+    if (event instanceof KeyboardEvent) {
+      event = mouse.getLastMoveEvent();
+    }
+
+    return create.start(event, newElement);
+  };
+};